Vue自定义组件

来源：互联网发布：知豆二手车evcar 编辑：程序博客网时间：2024/06/06 16:30

<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /><title>vue-component</title><script type="text/javascript" src="js/mui.js" ></script><script type="text/javascript" src="js/jquery-1.11.3.js" ></script><script type="text/javascript" src="js/vue.js" ></script><script type="text/javascript">         var vue;         $(function(){         //自定义组件         Vue.component('custom-template',//组件名            {         props:['param'],//组件接受外部参数        template:'<li>{{param.text}}</li>'//模板         });         //初始化vue         vue = new Vue({         el:"#app",         data:{         customList: [    { text: 'java' },    { text: 'Object c'},    { text: 'c++' }    ]         }         });         });</script></head><body><div id="app">      <ol>        <custom-template v-for="item in customList" v-bind:param="item"></custom-template>            </ol>      </div></body></html>

0 0