原組件inputTags：https://fly.layui.com/extend/inputTags/

在使用過程中發(fā)現(xiàn)一些選擇器存在局限性問題，于是進(jìn)行了修改；以及功能做了一些增強(qiáng)，使其更加滿足使用需求。

主要增強(qiáng)功能包含兩點(diǎn)：

---

1.增加openFlatContent、flatContent屬性：原組件使用時(shí)，當(dāng)一個(gè)頁面存在多個(gè)inputTags時(shí)，只能保證每個(gè)inputTags的content中的元素不重復(fù)，無法保證多個(gè)inputTags的content中的元素不重復(fù)。
使用：只需在渲染時(shí)將openFlatContent設(shè)置為true即可。openFlatContent為true代表使用flatContent,多個(gè)開啟了flatContent的inputTags的元素不能重復(fù)，反之代表不使用flatContent，可以與其他inputTags包含相同元素；可以通過inputTags.flatContent獲取flatContent。

2.增加pinArray屬性：原組件使用時(shí)，生成的tags都有close按鈕，而需求有時(shí)包含一些內(nèi)置內(nèi)容，強(qiáng)制要求包含時(shí)，只需在inputTags渲染時(shí)將需要需要內(nèi)置的內(nèi)容加入至pinArray即可，多個(gè)inputTags的pinArray相互獨(dú)立。

---

使用截圖：
渲染代碼

初次加載

pinArray效果展示

flatContent效果展示

---

快速上手
HTML：

                        <form class="layui-form">
                          <div class="layui-field-box">
                            <div class="layui-form-item" style="width: 90%;margin-left: 5%">
                                <label class="layui-form-label mylabel" style="font-size: 15px;color: #ff6436"><i
                                        class="iconfont"></i> 一級結(jié)構(gòu)</label>
                                <div class="layui-input-block tags">
                                    <input class="layui-input " type="text" id="phase" placeholder="回車生成標(biāo)簽" autocomplete="off"/>
                                </div>
                            </div>
                        </div>
                        <div class="layui-field-box">
                            <div class="layui-form-item" style="width: 90%;margin-left: 5%">
                                <label class="layui-form-label mylabel" style="font-size: 15px;color: #dca300"><i
                                        class="iconfont"></i> 二級結(jié)構(gòu)</label>
                                <div class="layui-input-block tags">
                                    <input class="layui-input" type="text" id="building" placeholder="回車生成標(biāo)簽" autocomplete="off"/>
                                </div>
                            </div>
                        </div>
                        <div class="layui-field-box">
                            <div class="layui-form-item" style="width: 90%;margin-left: 5%">
                                <label class="layui-form-label mylabel" style="font-size: 15px;color: #63bf00"><i
                                        class="iconfont"></i> 三級結(jié)構(gòu)</label>
                                <div class="layui-input-block tags">
                                    <input class="layui-input" type="text" id="unit" placeholder="回車生成標(biāo)簽" autocomplete="off"/>
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                         <div class="layui-input-block">
                            <button class="layui-btn" type="button" id="test">測試</button>
                         </div>
                        </div>
                     </form>

JS：

layui.use(['inputTags','form'], function () {
    var inputTags = layui.inputTags;
    $("#test").on("click",function (){
        console.log(JSON.stringify(structShield))
        console.log(inputTags.flatContent)
    })

    var structShield={
        phase:[],
        building:[],
        unit:[]
    }
    inputTags.render({
        elem:'#phase',
        content: ['期'],
        pinArray: ['期'],
        openFlatContent: true,
        aldaBtn: false,
        done: function(){
            structShield.phase=this.content;
        }
    })
    inputTags.render({
        elem:'#building',
        content: ['棟'],
        pinArray: ['棟','號樓'],
        openFlatContent: false,
        aldaBtn: false,
        done: function(){
            structShield.building=this.content;
        }
    })
    inputTags.render({
        elem:'#unit',
        content: ['單元'],
        pinArray: ['單元'],
        openFlatContent: true,
        aldaBtn: false,
        done: function(){
            structShield.unit=this.content;
        }
    })
});