vue.js父元件給子元件傳遞資料
阿新 • • 發佈:2018-12-18
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="vue.js"></script> </head> <body> <div id="box"> <parent></parent> </div> </body> </html> <script type="text/javascript"> var vm = new Vue({ el: '#box', data: { }, components: { 'parent': { template: '<div><h1>parent</h1><child :message="msg" :message2="msg2"></child></div>', data: function () { // body... return { msg: '煙鎖池塘柳', msg2: '桃燃錦江堤', } }, components: { 'child': { template: '<span>{{ message }},{{ message2 }}!</span>', props: ['message','message2'] } } } } }); </script>