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-->
最新文章
- LINQ教程
- Chrome 开发工具 Javascript 调试技巧
- Oracle大数据常见优化查询
- [oracle] ORACLE_HOME_LISTNER is not SET, unable to auto-start Oracle Net Listener
- NP完全问题
- oh my zsh设置
- Python番外 事务 那些事
- 为经典版eclipse增加web and JavaEE插件
- 面向对象的软件project——面向对象分析
- MVC分页示例
- __new__、__init__、__call__三个特殊方法
- cocapods 使用及问题
- Android app去掉https签名校验
- css img 隐藏的边距
- Lua学习之加载其他lua文件
- OpenStack构架简介
- BootStrap布局组件
- linux操作小技巧锦集
- BZOJ4124 : [Baltic2015]Tug of war
- Selenium基本使用(十三)测试中常见问题