前端最终规范


字典3

<pre><code class="language-markdown"> &lt;template&gt; &lt;div class="SelectDataCode"&gt; &lt;el-select v-model="value" v-bind="$attrs" v-on="$listeners"&gt; &lt;el-option v-for="(item, index) in options" :key="index" :label="item[defaultProps.label]" :value="item[defaultProps.value]" &gt;&lt;/el-option&gt; &lt;/el-select&gt; &lt;/div&gt; &lt;/template&gt; &lt;script&gt; export default { name: 'selectModel', data() { return { options: [], } }, props: { fn: { type: Function, required: true, }, query: { type: Number | String, }, selectValue: { type: Number | String, required: true, }, defaultProps: { type: Object, default: () =&gt; { return { label: 'fieldName', value: 'fieldId', } }, }, }, computed: { value: { get() { return this.selectValue }, set(newValue) { this.$emit('update:selectValue', newValue) return newValue }, }, }, watch: { selectValue: { handler: function (oldval, newval) { this.value = this.selectValue }, immediate: true, }, query: { handler: function (oldval, newval) { this.fn &amp;&amp; this.query &amp;&amp; this.fn({ objectModelId: this.query }).then((res) =&gt; { this.options = res if (this.query) { let index = this.options.findIndex( (item) =&gt; item.fieldId === this.value ) if (!~index) { this.value = '' } } }) }, immediate: true, }, } } &lt;/script&gt; &lt;style lang="scss" scoped&gt; &lt;/style&gt; </code></pre>

页面列表

ITEM_HTML