avalon2學習教程05屬性操做

時間  2019-11-11
標籤 avalon2 avalon 學習 教程 屬性 简体版
原文   原文鏈接

avalon2與avalon1的屬性操做雖然都是使用ms-attr，但用法徹底不同。javascript

avalon1是這樣操做屬性的html

其語法爲java


ms-attr-valueName="vmProp"

有多少個屬性就寫多個ms-attr-。其中不能省略。此外，還存在ms-title, ms-alt，ms-src, ms-href, ms-selected, ms-checked等等縮略寫法。但估計不多人知道，到底哪些屬性能夠縮寫，哪些不能。數組

avalon2從減輕用戶的記憶出發，將你要操做的屬性所有打包成一個對象，並規定，只能屬性值才能使用@開頭的vm屬性。此外，avalon不存在ms-title這樣的縮略寫法。性能
或者

attrObj爲vm的一個對象屬性，但這個不太經常使用。htm

或者對象

ms-attr直接對應一個數組。這個靈感是來自ReactNative的style指令，它們能夠經過數組，傳入多個樣式對象…………blog

不過不管你怎麼搞，最後你傳的東西能保持avalon內部能將它變回一個對象就好了。ip

有時你的對象很長，須要換行，avalon2也是支持的，即使你寫得像如下這麼噁心，avalon2仍是能認出來。字符串


 
 
 
 
  
  
  
  
<!DOCTYPE html>
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <script src="./dist/avalon.js"></script>
        <script >
            var vm = avalon.define({
                $id: "test",
                title:111,
                src: "222",
                lang: 333
            })

        </script>
    </head>
    <body ms-controller="test" >
          <div  aaa='ddd' bbb=333 
                ms-attr='{title: @title,
                    ddd:@src, 
                    lang:@lang}' >{{
                   @src ? 333: 'empty'
              }}</div>
          <input ms-duplex="@src"/>
    </body>
</html>

但爲了性能起見，ms-attr最好仍是保持在一行吧。

avalon2的ms-attr能夠支持過濾器，但沒有提供現成的過濾器，雖然用戶進行編寫。不過須要注意的是，這個過濾器要處理的是{title:'111',ddd: '222', lang:222}這樣的對象，而不是一個字符串。好比咱們要將須要個屬性轉換成日期格式，你能夠在你的過濾器裏調用avalon自帶的date過濾器。

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程