初探 vue 2.0 自定义组件的 v-model

最新推荐文章于 2024-07-23 14:46:42 发布

张振涛，代码界的搬运工

最新推荐文章于 2024-07-23 14:46:42 发布

阅读量717

点赞数

文章标签： vue.js elementui javascript 前端框架 vue

本文链接：https://blog.csdn.net/m0_63873004/article/details/123465104

版权

<template>
  <div class="home">
    <my-input :placeholder="'请输入内容'" v-model="inpval"></my-input>
    {{inpval}}
  </div>
</template>

<script>
import myInput from '../components/myInput.vue'

export default {
  name: 'Home',
  data() {
    return {
      inpval:'123'
    }
  },
  components: {
    myInput
  }
}
</script>

组件

<template>
    <div class=''>
        <input type="text" :placeholder="placeholder" @input="inp" :value="value">
    </div>
</template>

<script>
export default {
    props:{
        placeholder:String,
        value:String
    },
    data() {
        return {

        };
    },
    created() {},
    methods: {
        inp(e){
            this.$emit('input',e.target.value)
        }
    },
    components:{}
};
</script>

<style lang='scss'>

</style>