zl程序教程

您现在的位置是:首页 >  其他

当前栏目

小程序:model:value不生效

程序 value model 生效
2023-09-11 14:19:17 时间

wxml

<view class="input-form">
    <image style="width:48rpx;height:48rpx;margin-top:20rpx;" src="/images/icon-header.png"></image>
    <input type="text" class="weui-input" model:value="{{realName}}" placeholder="请输入姓名"/>
</view>

<button class="face-act" wx:if="{{!hasVerify}}" bindtap="checkUserFacticity">提交</button>

js

    data: {
        realName: '', 
    },

    async checkUserFacticity() {
        console.log("realname:"+this.data.realName)
        if (!this.checkIdname(this.data.realName)) {
            wx.showToast({
                title: "请输入正确名字",
                icon: "none",
                mask: true
            });
            return;
        }

问题:从input输入栏输入内容,js中获取不到,打印为空。

原因:暂不明确

解决方案:

wxml 中,input 添加响应事件 bindinput=“realnameInput”

<view class="input-form">
    <image style="width:48rpx;height:48rpx;margin-top:20rpx;" src="/images/icon-header.png"></image>
    <input type="text" class="weui-input" model:value="{{realName}}" bindinput="realnameInput" placeholder="请输入姓名"/>
</view>

<button class="face-act" wx:if="{{!hasVerify}}" bindtap="checkUserFacticity">提交</button>

js 中,添加事件 realnameInput(e){}

    data: {
        realName: '', 
    },


    realnameInput(e){
        const {value}= e.detail;
        //console.log(value);
        this.setData({
            realName:value
              })
       },
       
    async checkUserFacticity() {
        console.log("realname:"+this.data.realName)
        if (!this.checkIdname(this.data.realName)) {
            wx.showToast({
                title: "请输入正确名字",
                icon: "none",
                mask: true
            });
            return;
        }