【vue】el-input文本框v-model数据改变时不刷新的问题

news/2024/7/10 2:50:02 标签: vue

1.问题说明

1.在数组循环页面中,改变数组中某个底层的属性,对应的el-input所绑定的v-model的值改变后,el-input内容不更新

2.问题解决

1.可以在赋值的结尾加上this.$forceUpdate()强制更新

3.绑定的是对象的属性时,该属性一开始并没有

<el-input
    placeholder="请输入内容"
    :value="item.searchText"
    @input="(val) => changeInputEvent(val, item)"
  ></el-input>
  
 changeInputEvent(val, item){
    item.searchText = val;
    this.$forceUpdate()
  }

http://www.niftyadmin.cn/n/903269.html

相关文章

【vue】avue-crud配置大全-持续更新

1.表格属性 width: 100%,//表格宽度 calcHeight: auto,//表格高度差&#xff08;主要用于减去其他部分让表格高度自适应&#xff09; height: auto,//表格高度 maxHeight: auto,//表格最大高度 border: true,//是否显示表格边框 expand: false,//是否展开折叠行 index: false,…

【js】数组join用法

var array [1,2,3] var str array.join(",") console.log(str)

【vue】vue-clipboard2剪贴板示例

1.效果示例 2.依赖包下载 //这里用的是"vue-clipboard2": "^0.3.1" npm install vue-clipboard2 //或者 yarn add vue-clipboard23.使用依赖 import VueClipboard from vue-clipboard2 Vue.use(VueClipboard);4.页面示例 <template><div style…

【vue】异步请求同步的方法

handleClick() {return new Promise((resolve,reject) > {getRequest().then(res > {//操作1resolve();}).catch(error >{console.log(error)reject()})}) }, test(){Promise.all([this.handleClick()]).then(res>{//操作2}) }

【docker】linux干掉docker进程

1.说明 对于linux内存满了情况&#xff0c;sudo systemctl start docker,sudo systemctl restart docker,sudo systemctl stop docker等等重启 启动docker,均无反应&#xff0c;查询docker状态docker挂起了。直接干掉进程 sudo kill -9 15569

【docker】docker操作network

1、创建网络 test-network docker network create -d bridge --subnet 172.25.0.0/16 test-network docker network create test-network 2、将php容器或其他容器加入到test-network网络 docker network connect test-network php 3、 查看网络 docker network ls 4、 断开和移…

【vue】el-popover遍历渲染

1.示例图 2.示例代码 <template><div><el-popover placement"bottom" v-for"(item,index) in list" :key"index" width"250" trigger"manual" :ref"popover-${item.id}"><div class"t…

【vue】vue页面加定时方法

示例代码 data () {return {timer: } }, methods: {handleRefresh(){//执行方法逻辑}, }, //页面渲染结束加一个定时器&#xff0c;每2秒刷新一次 mounted() {this.timer setInterval(this.handleRefresh, 2000) }, //页面关闭前清除定时器 beforeDestroy() {clearInterval(t…