《黑天鹅》笔记
《对赌:信息不住时如何做出高明决策》笔记
鸡汤反思——关于随意
《如何阅读一本书》读书笔记
记杭州一处高低床青年旅舍
租房押金讨要记(2020年底-2021夏季)
巫师3的任务是如何自然引出的
交水费的波折于2024年
最喜欢的
几次睡觉做梦的内容

vue2在模板里使用动态属性名和动态方法名#前端#vue

背景

在vue的使用中,有时候需要在同一处根据情况使用不同属性或者不同方法

例如在v-for中,根据item的不同情况,给里面模板指定不同属性和方法

方案

属性

xx[type] 的方式

即将待动态使用的属性放在data的至少第二层级里,则可以根据type取得不同变量。如果放在data第一层,在模板里无法通过this和type取得所需变量,因为在模板里无法解析this

方法

  • 使用一个统一的入口方法xxx(type),在xxx方法内部再根据情况去调用具体要执行的方法

  • 对于组件属性,可使用高阶函数

  • 对于组件事件回调,不能用高阶函数,模板内容不会被执行

变量流转

例如处理数组循环的元素的各自业务处理

  • 使用中转data属性,例如currentSth,需要注意用$set做修改
  • 记录找到变量的索引,例如数组下标值
  • 使用闭包,注意用$set做修改

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注