zoukankan      html  css  js  c++  java
  • Svelte 对数组和对象操作时的响应式

    1 前言

    Vue2 中无法监听7个数组方法引发的变化,它们分别是:pop、push、reverse、shfit、unshift、sort 和 splice。

    2 正文

    Svelte 中同样无法监听以上 7 个数组方法的变动,此外,类似delete obj.a 这种操作也是无法监听的,因为在 Svelte 中,被更新的变量的名称必须出现在赋值语句的左侧

    <script>
      const list = Array.from({ length: 6 }).map((i, index) => index);
      const minus = () => {
        // list.pop(); // 不生效
        list.length = list.length - 1; // 生效
      };
    </script>
    
    <button on:click={minus}>{list.length}</button>
    <p>{list}</p>

    3 总结

    比起 Vue 改写了7个数组元素的操作,Svelte 让开发者自己决定用什么方法解决该问题,只能说便于开发者理解响应式设计的弊端吧,除此之外找不出其他理由。

    注意:对象的响应式同样遵循被更新的变量的名称必须出现在赋值语句的左侧这一设定,也就是说,obj.a = 123 可以正确响应,而 delete obj.b 不能。

    4 参考

  • 相关阅读:
    两数之和
    swift 结构体
    打家劫舍II
    Swift的访问控制讲解
    swift版 二分查找 (折半查找)
    RAC(ReactiveCocoa)介绍(一)
    变位词
    双向循环链表
    单链表
    顺序链表(C++)
  • 原文地址:https://www.cnblogs.com/aisowe/p/15245487.html
Copyright © 2011-2022 走看看