bootstrap-vue可编辑表复原值，如果出错
bootstrap-vue可编辑表复原值，如果出错
提问于 2019-04-30 19:43:22
我正在使用vue js和bootstrap-vue来创建一个可编辑的表，允许用户使用v- on :change assisting在表上进行更改以帮助axios更新数据库。限制是语言是唯一的，并且不能是空字符串，如果用户犯了错误，我似乎无法恢复该值。对此推荐的方法是什么？任何帮助都是非常感谢的。
我尝试通过执行以下操作来“刷新”该表：
this.languages = this.languages;似乎不会刷新表中的值。
桌子上的一段vue组件：
<b-table striped hover :items="filtered" :fields="fields">
<template slot="name" slot-scope="data">
<b-form-input type="text" :value="data.item.name" v-on:change="updateLanguage($event,data.item.id)"></b-form-input>
</template>
</b-table>在vue导出默认的方法中：
updateLanguage(e,id) {
if(e.trim()){
const find_langauge = this.languages.find(language=>{
return language.name.toLowerCase() === e.toLowerCase();
});
find_langauge ? this.languages = this.languages : console.log('no match');
} else {
console.log('cannot be empty');
this.languages = this.languages;
}
}在计算中：
filtered() {
return this.search ? this.languages.filter(language=>
language.name.toLowerCase().includes(this.search.toLowerCase())) : this.languages;
}回答 2
Stack Overflow用户
回答已采纳
发布于 2019-05-02 23:36:41
我找不到任何解决方案来刷新:值，所以我最终强制重新呈现组件。不是很理想，但至少整个组件都被刷新了。会喜欢任何更好的方法来实现这一点，而不是重新渲染。
Stack Overflow用户
发布于 2019-05-14 07:22:09
Vue不保留输入的“初始”值，因为它依赖于您的数据模型作为真理的来源。
您需要将初始值存储在数据中，并在检测到重置时，将该初始值复制回与输入关联的v-model。
此外，如果您在多行中有输入，最好在输入上设置一个唯一的key，或者如果您有一个唯一的键字段(每个项目行的值是唯一的)，那么在b-table上设置primary-key属性，让它为每个TR元素生成一个唯一的Vue key。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55920207
复制相关文章
相似问题
腾讯云开发者
