VUE 父组件向子组件传值

2024年1月9日 228次阅读 来源: yizheng

vue中使用组件中的props对象实现让当前组件获取父组件属性值的功能

这个对象很容易理解，废话不多说，上代码：

<div id="app">
    <mycomponent english="hello" chinese="你好"></mycomponent>
</div>

<script>
    Vue.component('mycomponent', {
        props: ['english', 'chinese'],
        template: '<div>{{english}} {{chinese}}</div>'
    })
    var app = new Vue({
        el: "#app"
    })
</script>

官网和书中都太过于啰嗦
我总结的重点有如下部分：

  1. props对象只接收数组或对象，上方例子是数组，对象类型实现起来也类似。
  2. 当使用props在子组件中对父组件内同名属性进行了定义后，对应的值就已经传到vue容器中了，在template中可直接使用，不用声明data对象。
    原文作者：yizheng
    原文地址: https://segmentfault.com/a/1190000019929277
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞