zoukankan      html  css  js  c++  java
  • vue知识点(工作中遇到)

    1、vue点击按钮动态添加多个input,并获取输入的值

     

    <template>
      <div>
        <input type="text" v-for="(item,i) of items" v-model="items[i]" :key="i">
        <button @click="onAdd">添加</button>
      </div>
    </template>
    <script>
    export default {
      data() {
        return {
          items: []
        }
      },
      methods: {
        onAdd() {
          this.items.push("");
        }
      }
    }
    </script>

    2、点击div,触发<input type="file"> 的点击事件

    <template>
        <div>
            <div class="ad-img-wrap" @click="changeImageHandler">
                <span class="iconfont iconjiahao"></span>
            </div>
            <input type="file" @change="changeImgHandler" ref="adImg" style="display: none;">
        </div>
    </template>
    <script>
    methods:{
        changeImageHandler () {
            this.$refs.adImg.dispatchEvent(new MouseEvent('click'))
        }
    }
    </script>
  • 相关阅读:
    第二章整理
    汇编实验二
    汇编实验一
    第一章整理
    第一部分 | 第1章 —— Hello Cocos2d-x
    返回 *this 的成员函数以及 const重载
    C++中的const
    680. Valid Palindrome II
    字典树
    单调队列
  • 原文地址:https://www.cnblogs.com/haishen/p/10254379.html
Copyright © 2011-2022 走看看