原文链接:https://blog.csdn.net/weixin_38984353/article/details/80847288

src实现数据绑定稍不留神就不成功。假定value.src是绑定的数据。

常见错误写法1:

<img src="value.src">

错误之处在于:

1.属性值数据绑定应该用v-bind,应该写成v-bind:src=""

2.直接用引号"value.src"会报错,取不到值。

常见错误写法2:

<img src="{{value.src}}">

常见错误写法3:

<img src="{value.src}">

以上均会报错。

个人亲测的2种正确写法:

<img :src=" 'files/'+value.src ">
<img :src="value.src">

mpvue 踩坑之src数据绑定出错的更多相关文章

  1. 小程序框架MpVue踩坑日记(一)

    小程序也做了几个小功能模块了,总觉得需要总结一下,踩坑什么的还是得记录一下啊. 好吧,其实是为了方便回顾 首先,说到小程序框架,大家都知道wepy,不过,我是没用过 美团开发团队到mpvue到是个实在 ...

  2. vue-cli 项目踩坑 npm install 时出错

    1.报错如下: 2.此时你执行npm run dev  / npm run build 会报错如下 npm ERR! code ELIFECYCLEnpm ERR! errno 1npm ERR! v ...

  3. 小程序框架MpVue踩坑日记(二)

    数据嵌套超过三层或者等于三层的时候 父组件传值给子组件后,如果子组件内的值需要改变 通过this.emit()传值后,父组件的值虽然会改变,但是视图并不会重新渲染 原因就是数据嵌套太多,没有触发ren ...

  4. 微信小程序之mpvue+iview踩坑之旅

    因为之前参照微信的原生的文档写过一些小程序的demo,写的过程比较繁琐,后来出了美团的mpvue,可以直接使用vue开发,其他的不作对比,这篇文章记录一下踩坑之旅. 参照mpvue http://mp ...

  5. mpvue实现微信小程序(欢迎踩坑)

    最近刚使用mpvue完成了微信小程序的开发,写点东西,做个记录. 首先依旧是两个传送门: 微信小程序文档:[https://developers.weixin.qq.com/miniprogram/d ...

  6. mp-vue实现小程序回顶操作踩坑,wx.pageScrollTo使用无效填坑

    本来项目都写的差不多了,测试测着侧着就冒出了新的想法,我因为做的是问卷,因此会有用户必答题未答完的可能存在,本来市场部给的需求就是做一个弹窗就好了,她说想要做出跳回到用户未答的第一道题,好吧,既然都这 ...

  7. react-router 踩坑记

    react-router踩坑分享 背景 辛苦历程 JavaScript动态修改 第一次尝试 第二次尝试 第三次尝试 第四次尝试 总结步骤 其他方案 原理 History 常见的3种History Br ...

  8. C# -- HttpWebRequest 和 HttpWebResponse 的使用 C#编写扫雷游戏 使用IIS调试ASP.NET网站程序 WCF入门教程 ASP.Net Core开发(踩坑)指南 ASP.Net Core Razor+AdminLTE 小试牛刀 webservice创建、部署和调用 .net接收post请求并把数据转为字典格式

    C# -- HttpWebRequest 和 HttpWebResponse 的使用 C# -- HttpWebRequest 和 HttpWebResponse 的使用 结合使用HttpWebReq ...

  9. 【踩坑速记】二次依赖?android studio编译运行各种踩坑解决方案,杜绝弯路,总有你想要的~

    这篇博客,只是把自己在开发中经常遇到的打包编译问题以及解决方案给大家稍微分享一下,不求吸睛,但求有用. 1.大家都知道我们常常会遇到dex超出方法数的问题,所以很多人都会采用android.suppo ...

随机推荐

  1. 前端BOM和DOM

      前端基础之BOM和DOM   前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些 ...

  2. npm run build时卡住不动了...

    在build文件夹里有个check-versions.js. if (shell.which('npm')) { versionRequirements.push({ name: 'npm', cur ...

  3. 微信小程序开发工具报错对应的服务器证书无效

    提示错误信息:“对应的服务器证书无效.控制台输入 showRequestInfo() 可以获取更详细信息.” 解决方法:详情 -->项目设置 --> 选择“不校验安全域名.TLS版本以及H ...

  4. javaScript 基础知识汇总 (十五)

    1.模块简介 什么是模块: 模块就是一个文件,一个脚本,通过关键字export 和 import 交换模块之间的功能. export 关键字表示在当前模块之外可以访问的变量和功能. import 关键 ...

  5. Netty源码分析一<序一Unix网络I/O模型简介>

    Unix网络 I/O 模型   我们都知道,为了操作系统的安全性考虑,进程是无法直接操作I/O设备的,其必须通过系统调用请求内核来协助完成I/O动作,而内核会为每个I/O设备维护一个buffer.以下 ...

  6. ILspy不能查看VS代码问题

    1.问题情况 刚接触IL,发现从网上下载的IL无法反编译 dll和exe文件都不行 出现如下提示: System.OutOfMemoryException: 数组维度超过了支持的范围. 2.解决方法 ...

  7. atomic的底层实现

    atomic操作 在编程过程中我们经常会使用到原子操作,这种操作即不想互斥锁那样耗时,又可以保证对变量操作的原子性,常见的原子操作有fetch_add.load.increment等. 而对于atom ...

  8. .NetCore 3.1 MVC 发布Linux实操

    记录自己.net Core的学习,现在来发布到Linux系统 第一步:准备一台CentOS 7 X64服务器 .net core 3.1项目 第二步:准备服务器.net core环境 1.安装微软官方 ...

  9. CVE-2019-3396:Confluence未授权模板注入_代码执行

    title: Confluence未授权模板注入/代码执行(CVE-2019-3396) tags: [poc,cve] 简介 Confluence是一个专业的企业知识管理与协同软件,也可以用于构建企 ...

  10. JDBC开源框架:DBUtils自定义业务类型相关转换器

    dbutils提供的handler转换不能满足实际业务开发的需求.比如枚举转int,时间类型LocalDateTime,实体对象的属性名与字段未能相对应. mysql表member结构字段: id.m ...