企业🤖AI Agent构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
## 表单 ### 基本用法 开发者可以给表单元素指定model属性实现数据的双向绑定。UOkay会根据表单元素的类型自动选择正确的方法来更新元素。 ### 文本 ~~~ <div id = "app"> <input model = "msg" placeholder="请输入"/> <div>{{msg}}</div> </div> ~~~ ~~~ var app = new Okay({ ele:'app', data: { msg:'' }, }) ~~~ ### 选择框 ~~~ <div id = "app"> <select model = "msg" > <option value = "你好,世界">中文</option> <option value = "Hello,World">英文</option> </select> <div>{{msg}}</div> </div> ~~~ ### 多行文本 ~~~ <div id = "app"> <textarea model = "msg" > </textarea> <div>{{msg}}</div> </div> ~~~ ### 单选Radio ~~~ <div id = "app"> <input type="radio" model="gender" name="gender" value = "Man"/>男 <input type="radio" model="gender" name="gender" value = "Woman"/>女 <div>{{gender=='Man'?'男':'女'}}</div> </div> ~~~ ~~~ var app = new Okay({ ele:'app', data: { gender:'Man' }, }) ~~~ ### 复选框 ~~~ <div id = "app"> <input type="checkbox" model="gender" name="gender" value = "Man"/>男 <div>{{gender=='Man'?'男':'女'}}</div> </div> ~~~ ### 复选框多选 ~~~ <div id = "app"> <input type="checkbox" model="interest" name="likes[]" value = "篮球"/>篮球 <input type="checkbox" model="interest" name="likes[]" value = "足球"/>足球 <input type="checkbox" model="interest" name="likes[]" value = "乒乓球"/>乒乓球 <div>{{interest|join}}</div> </div> ~~~ ~~~ var app = new Okay({ ele:'app', data: { interest:[] }, filters: { join(arr) { return arr.join(",") } } }) ~~~