完美解决微信小程序van-field left-icon自定义图片

实现效果:

html 复制代码
<view class="userName">
        <van-field left-icon="{{loginUserNameIcon}}" clearable class="fieldName" value="{{ loginUserName }}" placeholder="请输入账号" border="{{ false }}" >
        </van-field>
</view>
<view class="userName">
        <van-field left-icon="{{passwordIcon}}" clearable type="password" class="fieldName" value="{{ loginPassword }}" placeholder="请输入密码" border="{{ false }}" bind:blur ="companyCodeInput"/>
</view>

data中定义:

javascript 复制代码
data: {
 
    loginUserNameIcon:"/pages/img/username.png",
    passwordIcon:"/pages/img/psw.png",

  },
相关推荐
橙露几秒前
Webpack/Vite 打包优化:打包体积减半、速度翻倍
前端·webpack·node.js
chushiyunen4 分钟前
python中的魔术方法(双下划线)
前端·javascript·python
楠木68519 分钟前
从零实现一个 Vite 自动路由插件
前端
终端鹿30 分钟前
Vue2 迁移 Vue3 避坑指南
前端·javascript·vue.js
进击的尘埃33 分钟前
Signals 跨框架收敛:TC39 提案、Solid、Angular、Preact 的实现差异与调度策略对比
javascript
程序员陆业聪34 分钟前
工程师的瓶颈,已经不是代码了
前端
毛骗导演1 小时前
@tencent-weixin/openclaw-weixin 源码ContextToken 持久化改造:实现微信自定义消息发送能力
前端·架构
爱丽_1 小时前
Pinia 状态管理:模块化、持久化与“权限联动”落地
java·前端·spring
进击的尘埃1 小时前
从多仓到 Monorepo 的渐进式迁移:Git 历史保留、依赖收敛与缓存调优
javascript
SuperEugene1 小时前
TypeScript+Vue 实战:告别 any 滥用,统一接口 / Props / 表单类型,实现类型安全|编码语法规范篇
开发语言·前端·javascript·vue.js·安全·typescript