uniapp - emmet

话说，emment是官方uniapp直接引入的。基本上没做啥修改：可以点这里查看所有用法 - http://emmet.evget.com/

 

1.类似css层级写法

　　1.1　　view.ok>view.ok-child

<view class="ok">
    <view class="ok-child"></view>
</view>

　　1.2 　view.ok{ok$}*2>view.ok-child

<view class="ok">ok1
    <view class="ok-child"></view>
</view>
<view class="ok">ok2
    <view class="ok-child"></view>
</view>

　　1.3　　view.ok.oks.okss

<view class="ok oks okss"></view>

 

emment这里有个特殊的符号：$ 它跟 * 一起用的时候会生成数字序号1、2、3...  

 

 

2.隐式标签

.item它和div.item同作用(我且以为uniapp官方已经更改过它，貌似没有)

<div class="class"></div>

 

3.添加类型（值）

button[type=button][disabled=true]

<button type="button" disabled="true"></button>

 

4. 向上

view+view>view.ok^view.oks

<view></view>
<view>
    <view class="ok"></view>
</view>
<view class="oks"></view>

 

5. 文本填充

text{demo}

<text>demo</text>

 

6. 分组

view>form>(radio+input)*3

<view>
    <form action="">
    <radio></radio>
    <input type="text">
        <radio></radio>
            <input type="text">
        <radio></radio>
    <input type="text">
    </form>
</view>

 

7.CSS

/* 
            css缩写(根据你最近输入的输入进行匹配)：
            w100vh->width:100vh; 
            ovh->overflow: hidden;
            参考以上示例进行编写即可....
        */
        width: 100vh;
        overflow: hidden;