父組件往子組件傳值
阿新 • • 發佈：2019-01-07
com charset return span clas color 調用 strong meta
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="app"> <!--父組件通過調用v-bind把自己的nameList傳遞給子組件--> <my-button v-for="(item,index) in nameList" v-bind:key="index" v-bind:name="item" ></my-button> </div> <script src="vue.js"></script> <script> //註冊全局組件 子組件 Vue.component("my-button",{ template:`<h1>{{ this.name }}</h1>`, props:["name"], //告訴別人這裏需要傳入一個name參數 data(){return{ } } }); // 根實例 父組件 let app = new Vue({ el:"#app", data:{ nameList:["alex","wusir","mjj"] } }) </script> </body> </html>
父組件往子組件傳值