javascript - 如何在Vue JS中按下父组件上的按钮时刷新子组件的方法?

标签 javascript vue.js vuejs2

我在父组件的表单字段中有一个带有选择选项的提交按钮,现在,当用户更改选择选项时,它将采用该值并在子组件中执行方法/函数。 每当他发生变化时,我想自动更新子函数。

<select>
  <option value="www.google.com">google</option>
  <option value="www.facebook.com">facebook</option>
  <option value="www.twitter.com">twitter</option>
 
</select>

<button> Submit </button>

现在,当有人按下提交按钮时,它将在子组件上执行一个函数

export default {
  name: 'child',
  data () {
    return {
      title: 'Child',
    }
  },
  methods: {
    doSomething: function (url) {
     var newurl = url;
      
    }
    }
}

因此,当按下按钮时,doSomething方法将使用所选值执行。

最佳答案

您可以使用全局事件总线机制进行父子通信。这里有一篇文章深入介绍了如何实现这一点。

https://alligator.io/vuejs/global-event-bus/

关于javascript - 如何在Vue JS中按下父组件上的按钮时刷新子组件的方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46404987/

相关文章:

javascript - Angular 从 ng-repeat 中的 $scope 获取动态变量

vue.js - vue-devtools 总是被 nuxt.js 禁用

vue.js - Nuxt 嵌套路由

javascript - Vue.js - 如果模型拒绝更改,则恢复输入值

javascript - 如何使用 JSON 数据动态填充 jQuery Mobile 页面?

javascript - Bootstrap 选项卡面板选择了哪个选项卡

javascript - 由于 split 失败,match 函数返回什么?

vue.js - prop 改变时新的 vue 组件实例

unit-testing - vue-router 在运行测试期间不会重置

javascript - 为什么 v-for 只能工作一瞬间?