工作294:for[item.key]使用

小歌謠(公眾號同名)發表於2020-12-30
    <el-form label-width="80px">
      <el-form-item label="專案名">
        <el-input v-model="project_name" placeholder="請輸入專案名"></el-input>
      </el-form-item>
      <el-form-item v-for="item in AweMepro" :label="item.name">
        <el-input v-if="item.widget.type == 'input'" v-model="form[item.key]" placeholder="名稱"></el-input>
        <!--          <el-select v-else-if="item.widget.type == 'category-select'" v-model="form[item.key]" placeholder="">-->
        <!--            <el-option v-for="row in item.widget.categories" :label="row.title" :value="row.value"></el-option>-->
        <!--          </el-select>-->

        <!--          <el-cascader-->
        <!--            v-else-if="item.widget.type == 'category-select'"-->
        <!--            v-model="form[item.key]"-->
        <!--            :options="item.widget.categories"-->
        <!--            @change="handleChange"-->
        <!--          >-->
        <!--          </el-cascader>-->

        <el-cascader v-else-if="item.widget.type == 'category-select'" v-model="categoryValue"
                     :options="item.widget.categories" @change="handleChange">
          <template slot-scope="{ node, data }">
            <span>{{ data.title }}</span>
          </template>
        </el-cascader>


        <el-switch v-else-if="item.widget.type == 'boolean-select'" v-model="form[item.key]" text="是否原創"></el-switch>
        <el-tag v-else-if="item.widget.type == 'tag-input'" v-for="row in form[item.key]" size="medium" closable>{{
            row
          }}
        </el-tag>
        <el-date-picker
            v-else-if="item.widget.type == 'date-time'"
            v-model="form[item.key]"
            type="datetime"
            placeholder="選擇日期時間"
            value-format="timestamp"
        >
        </el-date-picker>
        <el-upload :action="action"
            v-else-if="item.widget.type == 'picture'"
            disabled>
          <img v-if="form[item.key]" :src="form[item.key]" class="avatar">
          <i v-else class="el-icon-plus avatar-uploader-icon"></i>
        </el-upload>
        <el-upload :action="action"
            v-else-if="item.widget.type == 'cover-pictures'"
            disabled>
          <img v-if="form[item.key]" :src="form[item.key]" class="avatar">
          <i v-else class="el-icon-plus avatar-uploader-icon"></i>
        </el-upload>
      </el-form-item>
    </el-form>
    <!-- <div v-for="(item,index) in this.itemsBian">
       <el-input v-if="item.widget.type='input'"  type="item.widget.type" placeholder="請輸入名稱" v-model="item.name"></el-input>
     </div>-->
    <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="ListAccept">確 定</el-button>
  </span>

相關文章