完美解决微信小程序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",

  },
相关推荐
鸡吃丸子20 小时前
Next.js 入门指南
开发语言·javascript·next.js
罚时大师月色20 小时前
Vue+ts 如何实现父组件和子组件通信
javascript·vue.js·ecmascript
漂流瓶jz21 小时前
快速定位源码问题:SourceMap的生成/使用/文件格式与历史
前端·javascript·前端工程化
samroom21 小时前
iframe实战:跨域通信与安全隔离
前端·安全
fury_12321 小时前
vue3:数组的.includes方法怎么使用
前端·javascript·vue.js
努力就够了21 小时前
微信小程序:日常零售供应系统
微信小程序·erp·接单·零售系统
weixin_4050233721 小时前
包资源管理器NPM 使用
前端·npm·node.js
宁&沉沦21 小时前
Cursor 科技感的登录页面提示词
前端·javascript·vue.js
Dragonir21 小时前
React+Three.js 实现 Apple 2025 热成像 logo
前端·javascript·html·three.js·页面特效