input回显用**屏蔽,修改的时候不屏蔽
时间: 2023-07-23 18:41:18 浏览: 81
密码回显* C语言版本
了解了您的问题,您可以通过v-model指令和computed属性来实现这个功能。
首先,您可以在模板中使用v-model将input的值和data中的变量绑定起来。例如:
```
<template>
<div>
<input v-model="name" />
</div>
</template>
<script>
export default {
data() {
return {
name: ''
}
}
}
</script>
```
然后,您可以使用computed属性来根据情况返回不同的值。例如:
```
<template>
<div>
<input v-model="name" />
<div>
显示姓名:{{ displayName }}
</div>
</div>
</template>
<script>
export default {
data() {
return {
name: ''
}
},
computed: {
displayName() {
if (this.name === '') {
return ''
} else if (this.isEditing) {
return this.name
} else {
return this.getMaskedName()
}
}
},
methods: {
getMaskedName() {
// 实现姓名屏蔽的方法
}
}
}
</script>
```
其中,isEditing是一个data中的变量,用来表示当前是否处于编辑状态。如果处于编辑状态,则直接显示输入的姓名;否则,使用getMaskedName()方法返回屏蔽后的姓名。getMaskedName()方法的实现可以根据您的具体需求来定制。
希望这个回答能够帮到您!
阅读全文