mip-list 清單元件

mip-list 清單元件，可以渲染同步數據，或非同步請求資料後渲染

##範例

基本用法

<mip-list src="https://xxx">
    <template type="mip-mustache">
        <div>
            <li>name: {{name}}</li>
            <li>alias: {{alias}}</li>
        </div>
    </template>
</mip-list>

自訂範本

<mip-list template="mip-template-id" src="https://xxx">
    <template type="mip-mustache" id="mip-template-id">
        <div>
            <li>name: {{name}}</li>
            <li>alias: {{alias}}</li>
        </div>
    </template>
</mip-list>

同步資料

<mip-list synchronous-data>
    <script type="application/json">
        {
            "items": [
                {
                    "name": "lee",
                    "alias": "xialong"
                }, {
                    "name": "ruige",
                    "alias": "ruimm"
                }, {
                    "name": "langbo",
                    "alias": "bobo"
                }
            ]
        }
    </script>
    <template type="mip-mustache">
        <div>
            <li>name: {{name}}</li>
            <li>alias: {{alias}}</li>
        </div>
    </template>
</mip-list>

點擊載入更多

<mip-list template="mip-template-id" src="http://xxx?" id="mip-list" has-more>
    <template type="mip-mustache" id="mip-template-id">
        <div>
            <li>{{key}}: {{value}}</li>
        </div>
    </template>
</mip-list>
<div class="mip-list-more" on="tap:mip-list.more"> 点击查看更多 </div>

屬性

#src

說明：非同步請求的資料介面

必選項：否
類型：字串
取值範圍：必須是https的
單位：無
預設值：無

synchronous-data

說明：使用同步資料開關屬性

必選項：否
類型：字串
取值範圍：無
單位：無
預設值：無

id

說明：mip-list 元件id

必選項：否
類型：字串
為值範圍：字串
單位：無
預設值：無

has-more

說明：是否有點擊展開更多功能

必選項：否
類型：字串
取值範圍：無
單位：無
預設值：無

#注意事項

非同步請求的介面需要規範過callback為'callback'
有has-more 屬性時，mip-list標籤，必須要有id屬性，同時需要有點擊按鈕的dom節點，且此節點有on屬性，屬性值為：tap:你的mip-list的id.more