zoukankan      html  css  js  c++  java
  • Vue中如何在组件内部实现一个双向数据绑定?

    假设有一个输入框组件,用户输入时,同步父组件页面中的数据。

    具体思路:父组件通过props传值给子组件,子组件通过 $emit 来通知父组件修改相应的props值,具体实现如下:

    可以看到,当输入数据时,父子组件中的数据是同步改变的:

    我们在父组件中做了两件事,一是给子组件传入props,二是监听input事件并同步自己的value属性。那么这两步操作能否再精简一下呢?答案是可以的,你只需要修改父组件:

     

    v-model 实际上会帮我们完成上面的两步操作。

    -------------------------------------------

    个性签名:独学而无友,则孤陋而寡闻。做一个灵魂有趣的人!

    如果觉得这篇文章对你有小小的帮助的话,记得在右下角点个“推荐”哦,博主在此感谢!

    万水千山总是情,打赏一分行不行,所以如果你心情还比较高兴,也是可以扫码打赏博主,哈哈哈(っ•̀ω•́)っ✎⁾⁾!

  • 相关阅读:
    异或运算
    GitHub使用简介
    归并排序
    快速排序
    字符串匹配
    Runner站立会议06
    Runner站立会议05
    Runner站立会议04
    记计账需求分析
    Runner站立会议03
  • 原文地址:https://www.cnblogs.com/mahmud/p/10492189.html
Copyright © 2011-2022 走看看