DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>vue的学习-vue组件title>
<script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js">script>
head>
<body>
<div id="app">
<myname>myname><br/>
<myname2 v-for="item in items" v-bind:propdata="item">myname2>
div>
<script>
//1.组件 -->
//定义一个vue组件component--myname为它的名字
// 扩展:vue的文件中都有就是因为他们的组件名称为template就是这里的myname
Vue.component("myname",{
template:'我的组件名称是myname>'
});
//2.组件 -->
//组件传参数
Vue.component("myname2",{
props:['propdata'],
template:'{{propdata}}>'
});
var vm=new Vue({
el:"#app",
data: {
items:['软件工程','信息技术','电商管理','软件测试']
},
//方法必须定义在vue的methods对象中!
methods:{},
});
script>
body>
html>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)