vue传参

vue中传参的三个步骤:
<body>
            <div id="app">
                 // ② 将变量与vue实例的数据相关联
                 <hello :reader="new_msg"></hello>
           </div>

 

   <script>
           var vm = new Vue({
                       el: "#app",
                      data: {
                              new_msg: "我是实例中的数据信息"
                      },
                      components: {
                             "hello": {
                                             data() {
                                                      return {
                                                           msg: "我是组件中的数据信息"
                                                      }
                                              },
                                             template: `
                                                 // ③ 模板中就可以成功接受传带过来的值
                                                  <h1>我在组件中只读取我组件中的数据,所以{{ msg }} -- {{ reader }}</h1>
                                              `,
                                            //   ①  定义一个传参变量  
                                            props: ["reader"]
                                 }
                          }
                   })
        </script>
</body>

 

posted @ 2017-09-21 21:34  不乱来的嫖客  阅读(181)  评论(0编辑  收藏  举报