前端最终规范


select tree支持检索树形

<pre><code class="language-markdown"> &lt;el-form-item label="备考地区"&gt; &lt;el-select ref="appendixAreas" popper-class="selectArea" v-model="form.appendixAreas.name" placeholder="请选择" :filter-method="filterMethod" style="height: 100%" filterable @focus="selectFocus" default-first-option &gt; &lt;el-option :label="form.appendixAreas.name" :value="form.appendixAreas.name" &gt; &lt;el-tree ref="tree" :highlight-current="true" :data="citys" node-key="name" :accordion="true" :props="defaultProps" :expand-on-click-node="true" @node-click="nodeClick" :filter-node-method="filterTree" &gt; &lt;/el-tree&gt; &lt;/el-option&gt; &lt;/el-select&gt; &lt;/el-form-item&gt;</code></pre> <pre><code class="language-markdown"> selectFocus (event) { this.$refs.tree.filter(''); }, filterMethod (query) { console.log(query); this.$refs.tree.filter(query); return true; }, filterTree (value, data) { if (!value) return true; return data.name.indexOf(value.trim()) !== -1; },</code></pre>

页面列表

ITEM_HTML