colaui基础

监控 c-watch

//    监控的方法函数 on  监控的参数名字
div(c-watch="fun on style" c-bind="styles")

//    js
fun(dom,model){
    console.log(dom) // 直接获取dom,只触发一次
    dom.style.background  = 'red'
    console.log(model)    //    获取到的dom
},

类名样式c-class

//    html
div(c-class="styles == 'red' ? 'blue' :'red'") 
    
//    js
model.set('styles','red')
button(c-onclick="changes()") 按钮

changes(){
    if(model.get('styles') == 'red'){
        model.set('styles','blue')
    }else{
        model.set('styles','red')
    }
    console.log(model.get('styles'))
},

行间样式 c-style

//    html
div(c-style="color:bgColor")颜色改变
div(c-style="fontSize:30") 直接写死

//    引入js
append scripts
    script(src="policycenter/atest/atest.js")

//js
model.set('bgColor','red')

隐藏c-display

<span c-bind="isshow"></span>
<button c-onclick="change()" c-bind="isshow">anniu</button>

model.set('isshow', true)
//    需要放在cola里面
model.action({
    change() {
        if (model.get('isshow')) {
            console.log(1)
            model.set('isshow', false)
        } else {
            model.set('isshow', true)
        }
    }
})

定义别名

//    定义的路径 as 改的名字
div(c-alias="items as it")
//    下面试循环
    div(c-repeat="item in it" c-bind="item.age") 

cola(function(model){
    model.set('items',[
        {'name':'x','age':1},
        {'name':'a','age':11},
        {'name':'q','age':13}
    ])
})

定义script

extends /_page

append head
block body
    div(c-alias="directions as ds")
        li(c-repeat="d in ds" c-bind="d.text")
append scripts
    script.
        cola(function (model) {
            model.set("directions", [
                {value: "east", text: ""},
                {value: "south", text: ""},
                {value: "west", text: "西"},
                {value: "north", text: ""}
            ]);
        });

append scripts
    script(src="policycenter/atest/atest.js") 

循环 c-repeat

//    和vue绑定事件一样;
//    c-bind用于双相绑定和显示
div(c-repeat="item in items" c-bind="item.age") 

cola(function(model){
    model.set('items',[
        {'name':'x','age':1},
        {'name':'a','age':11},
        {'name':'q','age':13}
    ])
})

双向绑定 c-bind

//    事件绑定
spn(c-bind="name")
c-input(type="text" c-bind="name")

cola(function(model){
    model.set('name','xioaming');
})

获取自己的value值

lonePrincipalChange(self,arg) {
    var lonePrincipal = Number(self.get("value"));
},

获取值

获取值理论上讲  遇到循环就用current
console.log(model.get("actual.plcSolution.plcPackage.plcMainClause.$oriCurAmount"))
console.log(model.get("actual.plcSolution.plcPackage").current.get('plcMainClause.$oriCurAmount'))

检查这个字段有没有数据

cola.util.dictionary('VehicleUseNature')

 

posted @ 2019-10-19 17:12  前端伪大叔  阅读(793)  评论(0编辑  收藏  举报