Vue2商品规格选择

最新推荐文章于 2024-09-07 11:52:22 发布

io无心

最新推荐文章于 2024-09-07 11:52:22 发布

阅读量865

点赞数 6

分类专栏： Vue 文章标签：前端 vue

需转载请联系QQ:846581636

本文链接：https://blog.youkuaiyun.com/LYXlyxll/article/details/135424617

版权

Vue2+Element-ui

Vu2仿写拼多多商家后台规则选择，为什么用Vue2呢，因为公司用的Vue2...
样式不是很好看，自己调一下就行。

<template>
  <div ref="inputContainer">

    <div>
      {
  { combinationsResult }}
    </div>

    <el-row>
      <el-col :span="10">
        <div class="input-group">
          <label for="columnOneName" style="width: 150px;">商品规格-1：</label>
          <el-input v-model="columnNoeName" id="columnOneName"></el-input>
        </div>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="10">
        <div class="input-group">
          <label for="columnTwoName" style="width: 150px;">商品规格-2：</label>
          <el-input v-model="columnTwoName" id="columnTwoName"></el-input>
        </div>
      </el-col>
    </el-row>

    <div v-show="columnNoeName!==''" v-for="(item, index) in classifyOne" :key="`one-${index}`"
         style="display: inline-block; width: 300px;">
      <el-input
          v-model="item.value"
          placeholder="请输入内容"
          @blur="() => handleBlur('classifyOne', index)"
          style="display: inline-block; width: