【JavaScript相关】请简单实现双向数据绑定MVVM(约81字)

请简单实现双向数据绑定MVVM

    <input id="input"/>
    
    <script>
      const data = {};
      const input = document.getElementById('input');
      Object.defineProperty(data, 'text', {
        get() {
          return this.value;
        },
        set(value) {
          input.value = value;
          this.value = value;
        }
      });
      input.addEventListener('change', function(e) {
        data.text = e.target.value;
      });
    </script>

当你修改输入框的值时,data.text会更新,而当你设置data.text的值时,输入框的值也会更新。这实现了简单的双向数据绑定。请注意,这只是一个基础示例,实际的MVVM框架会更复杂且功能更强大

THE END
喜欢就支持一下吧
点赞0 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容