Question

我单击“仪表板”链接时尝试显示对话框。问题是我无法将对话框值更改为true，因为它在数据方法中。有什么正确的方法吗？

  export default {
data: () => ({
  drawer: true,
  dialog: false
}),
props: {
  source: String
},
methods: {
  me: () => {
    alert('me')
  },
  showDialog: () => {
    this.dialog = true
  }
},
computed: {
  months: () => (
    this.months = ['na', 'asd', 'asd']
  )
}

}

以下是jsfiddle https://jsfiddle.net/vfztk8ve/

中的布局

Answer 1

我注意到你的布局中有以下代码。

<v-btn color="blue darken-1" flat @click.native="dialog = false">Close</v-btn>
<v-btn color="blue darken-1" flat @click.native="dialog = false">Save</v-btn>

我想说你完美地关闭对话框，并将组件的对话值设置为 false 。

实际上，数据方法的表现类似于变量，而不是组件中的方法，因为我们不会在所有组件实例中共享组件中的值。以下是official document。

定义组件时，必须将数据声明为返回初始数据对象的函数，因为将使用相同的定义创建许多实例。如果我们使用普通对象作为数据，那么同一个对象将在所有创建的实例之间通过引用共享！通过提供数据功能，每次创建新实例时，我们都可以调用它来返回初始数据的新副本。

如何更改数据方法中的值

1 个答案: