VUE使用el-ui的form表單輸入框批量搜索

 

 

針對form表單的輸入框單號批量查詢，這里用換行符進行分割，注意v-model不要使用.trim

 

 

 前端代碼：

 <el-form-item label="SKU編碼:" prop="prodNumbers">
           <el-input type="textarea" :rows="4" placeholder="請輸入SKU編碼" v-model="addData.prodNumbers"></el-input>
  </el-form-item>

后端代碼：

        /**
         * sku支持批量查詢，換行符分隔
         */
        queryDTO.setProdNumbers(StringUtils.trim(queryDTO.getProdNumbers()));
        if (StringUtils.isNotBlank( queryDTO.getProdNumbers())) {
            String[] prodNumberArr = StringUtils.split(queryDTO.getProdNumbers(), "\n");
            queryDTO.setProdNumberList(new ArrayList<String>());
            for (String prodNumber : prodNumberArr) {
                if (StringUtils.isNotBlank(prodNumber)) {
                    queryDTO.getProdNumberList().add(StringUtils.trim(prodNumber));
                }
            }
        }

 

mapper.xml

  <if test="prodNumberList != null and prodNumberList.size() != 0">
                AND erp_prod_in.prod_number IN
                <foreach collection="prodNumberList" index="index" open="(" close=")" separator=",">
                    #{prodNumberList[${index}]}
                </foreach>
            </if>