javascript - 如何让用户修改 Vue 中的计算属性？

Question

我正在收集一些我希望允许用户下载的数据，并且我正在尝试找出处理文件名的最佳方法。默认文件名应该是动态的并且基于当前日期，所以我认为我需要computed property为它创建一个。我还希望用户可以选择更改文件名。但是，当我将其设置为v-model输入表单时，表单内的任何更改都不会在属性上注册。我不知道如何捕获该新值，以便以后可以使用它生成文件。我尝试了多种组合v-model和使用 multiple computed properties，但它们都没有给我预期的结果。

这是一个 jsfiddle，其中包含查看我的问题所需的最少代码。

Answer 1

通常你会想要v-model引用一个data属性而不是一个计算属性。这种方法看起来像：

<input v-model="filename">

然后，您可以使用默认值初始化数据属性

data: {
    filename: this.defaultFilename()
}

并定义defaultFilename()为方法

methods: {
    defaultFilename() {
        return "whatever";
    }
}