zoukankan      html  css  js  c++  java
  • vue 父组件向子组件传参(笔记)

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <script src="../JS/vue.js"></script>
    <body>
    <!--父亲组件-->
    <div id="app">
    <cpn v-bind:arg1="messagqe" :arg2="movies"></cpn>
    </div>
    <!--父亲组件-->
    
    <!--组件-->
    <template id="cpn">
    <div >
    <!--    上面的div一定要加的一定要有个父级元素才能显示-->
    {{arg1}}
    {{arg2}}
     <ul>
         <li v-for="item in arg2">{{item}}</li>
     </ul>
    </div>
    
    </template>
    <!--组件-->
    
    <script>
        //父传子使用props
        const cpn={
            template:"#cpn",
          //第一种  props:["arg1","arg2"],
         //第二种   props:{arg1:String,arg2:Array},
            props:{
                arg1:{type:String,default:"默认值1",required:true},//true是需要参数
                arg2:{type:Object,default:"默认值2",required:true}
            },
    
            data()//必须以函数xingshi
            {
             return{};
            }
    
    
        }
    
        const app =new Vue({
            el:"#app", //挂载那个元素
            data:{ messagqe:"胡鸡鸡", movies:["qq","www","aiai","saosao"]},
            components:{
                cpn
            }
    
        })
    
    </script>
    </body>
    
    </html>
    

      直接上函数不逼逼

  • 相关阅读:
    回发保留前台添加的html
    关于NBear数据访问层IDData
    使用js把数字转化成会计格式
    二次注入
    .htaccess利用与Bypass方式总结
    HTTPoxy漏洞(CVE-2016-5385)
    JAVA并行程序基础一
    队列-数组实现
    Vuex
    稀疏数组
  • 原文地址:https://www.cnblogs.com/xuexidememeda/p/12255540.html
Copyright © 2011-2022 走看看