FormItem 值修改了 页面未刷新
也添加了 key 还是不行
问:动态修改数据以后页面怎么刷新
>= v2.1.0的版本已经修复此问题,对于旧版本可以使用以下方案解决:
>= v2.1.0
key属性改变时,组件将被整个替换,你也可以理解为重新渲染,其实你应该早就使用过它,因为v-for往往都需要绑定:key="idx"
key
替换
v-for
:key="idx"
基于以上特性:
input1: <input v-model="state.value1" /> input2: <input v-model="state.value2" :class="state.value1" :key="state.value1" />
以上的 input2 总是在 input1 值改变时重新渲染,并且新渲染的 input2 的 class="state.value1"
通过key可以轻松的实现重新渲染某个组件、触发组件生命周期钩子、触发过渡等等,请举一反三、灵活应用,如老哥这样来了个valueKey的就属于离谱的范畴了😂,这本是vue基础,,具体文档在VUE文档
重新渲染某个组件
触发组件生命周期钩子
触发过渡
key还能以更花哨的方式赋值,当属性改变时,重新渲染组件:
<tag :data="array" :key="array.toString()" /> <tag :data="object" :key="JSON.stringify(object)" />
可以给一个解决的示例吗;
这还要示例,你如果不能写代码,请个人呗,这是HTML属性的范畴,这么简单的属性作用大张旗鼓的给你写了一大篇...
HTML属性
组要是没理解 FormItem 的key 怎么添加
不是基础差呀! 在原生 for 中 我可以给每一个标签 添加key 但是FormItem组件里面我怎么添加 我的结构是这种 topic_source:{ '国内':'国内', '国外':'国外' }
<FormItem :input-attr="{clearable:false,valueKey:state}" style="max-width: 300px" label="题目来源" type="select" :data="{content: { ...state.topic_source}}" v-model="ruleForm.topic_source" prop="cognize" placeholder="请选择题目来源"/> <el-form-item prop="cognize" label="题目来源"> <el-select clearable v-model="ruleForm.topic_source" placeholder="请选择题目来源" style="max-width: 300px"> <el-option v-for="item in state.topic_source" :key="item.value" :label="item.label" :value="item.value" /> </el-select> </el-form-item>
key属性改变时,组件将被整个替换,你也可以理解为重新渲染
组件替换,重新渲染!这不能理解吗?
<FormItem :key="a" />
a改变时,重新渲染FormItem组件,原来的没有了,不要了,删了,根据key换个新的摆在哪儿,并且应用新给的属性,这很难理解吗?
a
FormItem
我刚刚看了一下文档, 弄出来了 我以为FormItem里面封装了 key 这个字段。
我是写后端的,对前端不是太熟悉😞
这不是FormItem的属性,也不是ba提供的,它是VUE的虚拟dom标识,官方称为vnode算法提示,可以用于任何组件/标签
VUE
vnode算法提示
好的,理解了 我吧vue 基础好好巩固一下
感谢分享~
>= v2.1.0
的版本已经修复此问题,对于旧版本可以使用以下方案解决:key
属性改变时,组件将被整个替换
,你也可以理解为重新渲染,其实你应该早就使用过它,因为v-for
往往都需要绑定:key="idx"
基于以上特性:
以上的 input2 总是在 input1 值改变时重新渲染,并且新渲染的 input2 的 class="state.value1"
通过
key
可以轻松的实现重新渲染某个组件
、触发组件生命周期钩子
、触发过渡
等等,请举一反三、灵活应用,如老哥这样来了个valueKey的就属于离谱的范畴了😂,这本是vue基础,,具体文档在VUE文档key还能以更花哨的方式赋值,当属性改变时,重新渲染组件:
可以给一个解决的示例吗;
这还要示例,你如果不能写代码,请个人呗,这是
HTML属性
的范畴,这么简单的属性作用大张旗鼓的给你写了一大篇...组要是没理解 FormItem 的key 怎么添加
不是基础差呀!
在原生 for 中 我可以给每一个标签 添加key 但是FormItem组件里面我怎么添加
我的结构是这种
topic_source:{
'国内':'国内',
'国外':'国外'
}
key
属性改变时,组件将被整个替换
,你也可以理解为重新渲染组件替换,重新渲染!这不能理解吗?
a
改变时,重新渲染FormItem
组件,原来的没有了,不要了,删了,根据key
换个新的摆在哪儿,并且应用新给的属性,这很难理解吗?我刚刚看了一下文档, 弄出来了 我以为FormItem里面封装了 key 这个字段。
我是写后端的,对前端不是太熟悉😞
这不是
FormItem
的属性,也不是ba提供的,它是VUE
的虚拟dom标识,官方称为vnode算法提示
,可以用于任何组件/标签好的,理解了 我吧vue 基础好好巩固一下
感谢分享~
- 1
前往