vue中在不同的组件传递参数

1，A组件引入B组件

<script>
    import B from '../components/B.vue'
    export default {
        name: "A",
        components:{B},
        data(){
          return{
              pass_data: '',
          }
        },

 

2，A组件页面传递参数,把pass_data的数据传给B

<div>                  
   <B :the_data="pass_data"></B>
</div>

 

3，B组件上对传递参数的定义

export default {
    name: "B",
    props: {
        the_data: {
            type: String,
            // default: ""
        }
    },

 

4，B组件显示从A组件获取到的数据

<p>{{the_data}}</p>

 

如果对我的其它文章有更多的兴趣，可以访问我的个人博客：uniqueho.xyz