• knockout+weui+zepto


    主文件wxapp.ts

    1>在ts中,建议继承componentui

    //操作菜单表 actionsheet

    showactionsheet

    {

    title 上拉菜单标题

    btns 操作组 建议不超过5个。

    每个定义

    {

    btnname 名称

    color 颜色

    operation:()=>{} 操作方法

    }

    }
    //对话框 dialog

    showdialog

    showactionsheet

    {

    title 上拉菜单标题

    btns 操作组 建议不超过5个。

    每个定义

    {

    btnname 名称

    color 颜色

    operation:()=>{} 操作方法

    }

    }
    //信息 msg

    showmsg

    {

    title:KnockoutObservable<string>, 标题
        msgtype:KnockoutObservable<number>,类型 0 成功 1失败
        desc:KnockoutObservable<string>,描述
        btnnext:KnockoutObservable<false>,下一步 绿色按钮是否显示
        nextoperation:()=>{},操作
        nextbtnname:KnockoutObservable<string>, 下一步名称
        btnclose:KnockoutObservable<false>, 关闭是否显示
        closeoperation:()=>{},操作
        closebtnname:KnockoutObservable<string>,关闭名称
        urltitle:KnockoutObservable<string>,url名称
        url:KnockoutObservable<string>,url
        footertext:KnockoutObservable<string>结尾名称

    }
    //时间选择 picker

    showdatedialog

    {

    /*回调函数*/callbackdate: (pickerdataitem[]),
            /*开始日期*/begindate?: string,
            /*结束日期*/enddate?: string,
            /*默认选中日期*/defalutdate?:string

    }

    pickerdataitem

    {

    /*显示值*/displaytext: string;
        /*非显示值*/canotselected: KnockoutObservable<boolean>;
        /*主键*/datakey: string;
        /*值*/value: any

    }
    //地址选择 picker

    showcitydialog

    {

    /*回调函数*/callbackdate: (pickerdataitem[]),
            /*默认选中'省-市-县/区'*/defalutdate?:string

    }
    //自动提示 toast

    showtoast

    {

    /*toast标题*/toasttitle:string,
            /*自动关闭时间秒,0不关闭*/closetime: number=1,
            /*toast类型,0提示,1等待*/toasttype: number=0

    }

    closetoast 关闭toast

    验证的问题

    ko.validation.init({
                registerExtenders: true,
                messagesOnModified: true,
                insertMessages: false,/*如果messageTemplate有,就插入它,否则是<span*/
                //errorsAsTitle: true,
                parseInputAttributes: true,
                //messageTemplate: 'errorft-template',
                //errorClass: 'error',/*显示到input的class上面*/
                errorElementClass: 'weui-cell_warn'
                //decorateInputElement: true
            }, true);

      

    页面结构

    <div class="weui-cell" data-bind="validationElement: pointnum">
                        <div class="weui-cell-hd">
                            <label class="weui-label">授权站点</label>
                        </div>
                        <div class="weui-cell-bd weui-cell-primary">
                            <input class="weui-input" type="text" name="text" placeholder="请输入授权站点[0-99]" data-bind="textinput: pointnum" />
                        </div>
                       <div class="weui-cell-ft" data-bind="visible: pointnum.isModified() && !pointnum.isValid()">
                            <i class="weui-icon-warn"></i>
                        </div>
                    </div>

    显示上面错误红字的结构

    <!--ko if:(errors.isAnyMessageShown() && errors().length > 0)-->
            <div class="weui-toptips weui-toptips_warn" data-bind="text: (errors().length > 0 ? errors()[0] : '')"></div>
            <!--/ko-->

  • 相关阅读:
    Codevs2822 爱在心中
    3098: Hash Killer II
    课程总结
    团队作业——个人总结
    团队作业2
    团队个人分工
    装甲车团队介绍(别急,在做了)
    面向对象程序设计作业(4)
    面向对象程序设计作业(3)
    面向对象程序设计(2)
  • 原文地址:https://www.cnblogs.com/forhell/p/8488928.html
Copyright © 2020-2023  润新知