el-input二次封装

父组件

<template>
  <div id="app">
    <h-input v-model="name" />
  </div>
</template>

<script>
import hInput from "./views/demo/index";

export default {
  name: "App",
  data() {
    return {
      name: "",
    };
  },
  components: {
    hInput,
  },
  watch: {
    name(val) {
      console.log(val);
    },
  },
};
</script>

子组件

<template>
  <div>
    <el-input :value="value" @input="inputChange($event)"></el-input>
  </div>
</template>

<script>
export default {
  props: {
    value: String,
  },
  components: {},
  data() {
    return {};
  },
  methods: {
    inputChange(val) {
      this.$emit("input", val);
    },
  },
};
</script>
posted @ 2021-01-05 14:00  飞鸟和蝉-  阅读(1988)  评论(0编辑  收藏  举报