vue问题日常

博客主要记录了前端开发中的常见问题及解决思路。包括数据更新时视图未更新、修改操作取消时回滚数据(可将初始数据保存为字符串备份)、axios post请求后端收不到参数,以及加载图片失败时设置默认图片等问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、数据更新时视图没有更新:

Vue.set(obj, index, data);
this.$set(obj, index, data);
// obj: 要改变的对象
// index: 要改变的对象的序号
// data: 新数据

2、修改操作取消时回滚到初始数据:

可将初始数据另保存为字符串格式,用JSON.stringify()去做一个备份。

3、axios post请求,后端收不到参数:

// 第一种:用new FormData()的方式传递数据。
    let data = new FormData();
    data.append('userId','1');
    this.axios.post("/url", data)...
// 第二种:用字符串拼接的方式。
    this.axios.post("/url", `name=xx&userId=1`)...

4、加载图片失败时设置默认图片:

<img width="100%" :src="dialogImageUrl" :onerror="errorImg" alt="">

export default{
    data(){
        return{
            errorImg: `this.src='${require('../assets/img/error.jpg')}'`
        }
    }
}

/*
 * 也可再main.js中将其挂载在vue原型中,如此不用在每个模块中定义errorImg,注意改变图片路径
 * main.js-->Vue.prototype.errorImg = `this.src='${require('./assets/img/error.jpg')}'`;
 * <img width="100%" :src="dialogImageUrl" :onerror="this.errorImg" alt="">
 */

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值