vue组件传值方式

父组件向子组件传值：

父组件

<template>
    <div id="app">
        <img alt="Vue logo" src="./assets/logo.png" />
        <HelloWorld msg="Welcome to Your Vue.js App" :msg2="msg2" /> <!-- 3.在template写上子组件，msg就是向子组件传的值，也可以用v-bind动态绑定 -->
        
    </div>
</template>

<script>
import HelloWorld from "./components/HelloWorld.vue";  // 1.引入子组件

export default {
    name: "App",
    components: {
        HelloWorld,  // 2.注册子组件
    },
    data() {
        return {
            msg2: '动态的值'
        }
    },
};
</script>

子组件

<template>
    <div class="hello">
        msg的值=>{
  {msg}}
        <p>msg2的值=>{
  {msg2}}</p>
    </div>
</template>

<script>
export default {
    name: 'HelloWorld&#