父向子元件傳遞資料

props向元件傳遞資料

1.通一個檔案內資料傳遞

   <div id="vm">
    <blog-t title="標題" subtitle='副標題'></blog-t>
    </div>
    <script>
        const app = Vue.createApp({});
        app.component('blog-t',{
            props:['title','subtitle'],
            template: `<h4>{{ title }}</h4><br>{{subtitle}}`
        });
        const vm = app.mount('#vm');
    </script>

2.多個檔案

    <div id="vm">
        <button-a :title='title'></button-a>
    </div>
    <script type="module">
        import * as obj from './main.js'
        const app = Vue.createApp({
            data() {
                return {
                    title:'abcd'
                }
            }
        });
        app.component('button-a', obj.btn1)
        const vm = app.mount('#vm');
    </script>

main.js

const btn1 = {
            props:['title'],
            template: `<button>{{title}}</button>` 
        }
export {btn1}

子向父元件傳遞資料

1.