Vue项目el-input 不能输入的解决办法

目录

一、背景

二、解决办法

1、方法1:标签嵌套太深

2、方法2:使用了 template 作为 el-input 的父标签

3、方法3:v-model

一、背景

输入框动态填充值,但是填充后不能编辑了,
就像是被禁止了一样, 就很无语...

查了下资料, v-model填写了, 也没有templete标签嵌套

最终方法一即可解决问题...

二、解决办法

1、方法1:标签嵌套太深

如果标签嵌套太深，会导致无法获取到 DOM，这是我们需要 $forceUpdate() 强制刷新，才可获取

<el-input type='text' v-model='value' @change='change()'></el-input>
data(){
	return {
		value:'',
	}
}
change(){
	this.$forceUpdate();  //强制刷新
}

2、方法2:使用了 template 作为 el-input 的父标签

这种情况需要在 template 中添加 slot-scope 属性，

<template slot-scope="scope">

3、方法3:v-model

el-input 中没有 v-model

有用请点赞，养成良好习惯！

疑问、交流、鼓励请留言！

---