Home Examples Charts Dashboard Projects Menu

Vue.js examples
Learn Vue.js

vuejs components

Related:
Vue: Step-By-Step Guide To Mastering Vue.js From Beginner To Advanced (Vue.js, Learning Vue js 2)

Vue Components are great: create your own HTML elements, encapsulated as an HTML tag.

An template can be created inside a component, the component itself can be used as a tag:

<div id="app">
<component></component>
</div>

Download Vue.js Examples

vuejs components

Components need to be registered. You can add a components section to your app.
Inside this section you can define the tags that link to the component.

See the example below app.js:


var exampleComponent = {
template: '<div>
Component examples
</div>'
};

new Vue({
el: '#app',
components: {
'example': exampleComponent
},
data: {
posts: []
},
methods: {
}
});

Then inside your template, index.html:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>//vuejsexamples.net</title>
<!-- include vue -->
<script src="//unpkg.com/vue"></script>
</head>
<body>
<div id="app">
<example></example>
</div>
</body>
<script src="app.js"></script>
</html>

← vuejs ajax vuejs class →

Posts


© vuejsexamples.net - Privacy Policy - Cookie Policy