上下文

在Vue 2.0中,文档和others清楚地表明,父母与子元素之间的沟通是通过props 进行的.

问题

父母如何通过props 告诉子元素发生了什么事?

我应该只看一个叫做"事件"的props 吗?这感觉不对劲,其他 Select 也不对劲($emit/$on适用于子对象到父对象,而中心模型适用于遥远的元素).

示例

我有一个父容器,它需要告诉它的子容器,可以在API上执行某些操作.I need to be able to trigger functions.

推荐答案

给子组件一个ref,并使用$refs直接调用子组件上的方法.

html:

<div id="app">
  <child-component ref="childComponent"></child-component>
  <button @click="click">Click</button>  
</div>

JavaScript:

var ChildComponent = {
  template: '<div>{{value}}</div>',
  data: function () {
    return {
      value: 0
    };
  },
  methods: {
    setValue: function(value) {
        this.value = value;
    }
  }
}

new Vue({
  el: '#app',
  components: {
    'child-component': ChildComponent
  },
  methods: {
    click: function() {
        this.$refs.childComponent.setValue(2.0);
    }
  }
})

有关详细信息,请参阅Vue documentation on refs.

Javascript相关问答推荐

为什么在获取回调内设置状态(不会)会导致无限循环?

如何按预期聚合SON数据?

我无法在NightWatch.js测试中获取完整的Chrome浏览器控制台日志(log)

当作为表达式调用时,如何解析方法decorator 的签名?

自定义高图中的x轴标签序列

为什么按钮会随浮动属性一起移动?

如何根据当前打开的BottomTab Screeb动态加载React组件?

我正在建立一个基于文本的游戏在react ,我是从JS转换.我怎样才能使变量变呢?

这个值总是返回未定义的-Reaction

WP Bootstrap NavWaker:下拉菜单一次打开所有下拉菜单

检索相加到点的子项

查询参数中的JAVASCRIPT/REACT中的括号

使用NextJS+MongoDB+Prisma ORM获取无效请求正文,无法发布错误

触发异步函数后不能显示数据

自定义图表工具提示以仅显示Y值

在D3条形图中对具有相同X值的多条记录进行分组

对具有相似属性的对象数组进行分组,并使用串连的值获得结果

Phaser3 preFX addGlow不支持zoom

无法使用npm install安装react-dom、react和next

未找到用于 Select 器的元素:in( puppeteer 师错误)