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-->