小编Cod*_*iwi的帖子

代码笔：https ://codepen.io/codingkiwi_/pen/XWMBRpW

假设你有一堂课：

class MyClass {
  constructor(){
    this.entries = ["a"];

    //=== example change triggered from INSIDE the class ===
    setTimeout(() => {
      this.entries.push("c");
    }, 1000);
  }
}

在组件中，您可以获得该类的一个实例：

const { reactive } = Vue;

const App = {
  setup() {
    const myobject = reactive(new MyClass());

    //=== example change triggered from OUTSIDE the class ===
    setTimeout(() => {
      myobject.entries.push("b");
    }, 500);
    
    return {
      myobject
    };
  }
}

DOM 中的 myobject.entries 数组将显示条目"a"和"b"，但不显示"c"

我正在开发一个电子应用程序，我不明白的是像 Visual Studio Code 这样的应用程序如何实现如此快的启动时间，我的意思是单击图标直到窗口打开之间的时间（直到加载 main.js） 。

我已经读过很多关于加速 Electron 的文章，但它们都只是谈论 main.js 加载后发生的事情。

我下载了电子快速启动示例，并使用电子构建器将其打包为便携式应用程序。

• Visual Studio Code：1-2 秒后出现窗口
• 电子快速启动：5-10秒

我只是想知道性能问题出在哪里，便携式？电子制造商？

我在电子构建器中发现了一个问题，似乎表明便携式应用程序在应用程序启动时被提取到临时文件夹中，这就是缓慢的原因

我有一个自定义组件，它接受modelValueprop 并发出update:modelValue事件。在父组件中，我传递一个数组：

测试组件.vue

<template>
  <div>
     <button @click="updateIt">Test</button>
  </div>
</template>

<script>
export default {
    props: {
       modelValue: Array
    },
    emits: ["update:modelValue"],
    setup(props, {emit}){
        return {
            updateIt(){
                emit("update:modelValue", [4,5,6])
            }
        }
    }
}
</script>

应用程序.vue

<template>
  <div>
     <test-component v-model="myArr"/>
     <ul>
         <li v-for="i in myArr" v-text="i"></li>
     </ul>
  </div>
</template>

<script>
import TestComponent from "./TestComponent.vue";

export default {
    components: {
        TestComponent
    },
    setup(props, {emit}){
        const myArr = reactive([1,2,3]);

        return {
            myArr
        }
    }
}
</script>

当我按下按钮时，列表不会更新，为什么？