Vue连接字符串三个方法
一、通过methods
1、定义数据

在这里插入图片描述

2、添加绑定事件

在这里插入图片描述

3、创建methods方法

在这里插入图片描述

二、通过watch
1、定义数据（同上）
2、绑定数据（不需绑定事件）

在这里插入图片描述

3、创建watch方法在这里插入图片描述

watch 内置了新值 newVal 和旧值 oldVal。

三、通过computed
1、定义数据

在这里插入图片描述
注意这里没有定义 fullname。

2、绑定数据

在这里插入图片描述

3、创建computed方法

在这里插入图片描述

四、总结

使用 methods 来定义的话，比较简单方便。缺点是需要如果事件是摸不着的，这就绑定不了事件了，就行不通了，此时只能用 watch 和 computed。而 watch 弊端也很明显，太多数据的话会写的很繁琐。computed 可以说折中这两种方法，其属性的结果会被缓存。

Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'current')"

这是一个 Vue.js 错误，报错信息提示在 v-on 处理程序中出现了错误：“TypeError: Cannot read properties of undefined(读取 'current')”。这意味示在您的代码中，试图读取一个未定义的变量 'current'。您需要检查您的代码，确保 'current' 已正确定义并初始化。...

avatar Vue