<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>引用模板</title>
    <script src="js/vue.js"></script>
</head>
<body>
    <div id="itany">
        <my-hello></my-hello>
        <my-hello></my-hello>
    </div>

    <template id="wbs">
        <!-- <template>必须有且只有一个根元素 -->
        <div>
            <h3>{{msg}}</h3>
            <ul>
                <li v-for="value in arr">{{value}}</li>
            </ul>
        </div>
    </template>

    <script>
        var vm=new Vue({
            el:'#itany',
            components:{
                'my-hello':{
                    name:'wbs17022',  //指定组件的名称,默认为标签名,可以不设置
                    template:'#wbs',
                    data(){
                        return {
                            msg:'欢迎来到南京网博',
                            arr:['tom','jack','mike']
                        }
                    }
                }
                
            }
        });    
    </script>
</body>
</html>

 

相关文章:

  • 2021-11-07
  • 2022-12-23
  • 2021-08-30
  • 2021-07-31
  • 2022-12-23
  • 2021-08-20
  • 2021-06-16
  • 2021-12-31
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2021-12-17
  • 2022-12-23
  • 2021-09-05
  • 2022-12-23
  • 2021-10-24
相关资源
相似解决方案