• VUE3-40-单文件组件
  介绍 在很多 Vue 项目中，我们使用 app.component 来定义全局组件，紧接着用 app.mount(‘#app’) 在每个页面内指定一个容器元素。 这种方式在很多中小规模的项目中运作的很好，在这些项目里 JavaScript 只被用来加强特定的视图。但当在更复杂的项目中，或者你的前端完全由 JavaScript 驱动的时候，下面这些缺点将变得非常明显： 全局定义 (Glo...
  2021-08-02 13:01:55 | VUE
• VUE3-39-Vue 2 中的更改检测警告
  由于 JavaScript 的限制，有些 Vue 无法检测的更改类型。 但是，有一些方法可以规避它们以维持响应性。 对于对象 Vue 无法检测到 property 的添加或删除。由于 Vue 在实例初始化期间执行 getter/setter 转换过程，因此必须在 data 对象中存在一个 property，以便 Vue 对其进行转换并使其具有响应式。 例如： var vm = ne...
  2021-08-02 13:01:55 | VUE
• VUE3-38-组合式 API 渲染机制和优化
  虚拟 DOM 现在我们知道了侦听器是如何更新组件的，你可能会问这些更改最终是如何应用到 DOM 中的！ 也许你以前听说过虚拟 DOM，包括 Vue 在内的许多框架都使用这种方式来确保我们的接口能够有效地反映我们在 JavaScript 中更新的更改 我们用 JavaScript 复制了一个名为 Virtual Dom 的 DOM，我们这样做是因为用 JavaScript 接触 DOM ...
  2021-08-02 13:01:55 | VUE
• VUE3-37-组合式 API 模板引用
  模板引用 在使用组合式 API 时，响应式引用和模板引用的概念是统一的。为了获得对模板内元素或组件实例的引用，我们可以像往常一样声明 ref 并从 setup() 返回： <template> <div ref="root">This is a root element</div> </template> <script>...
  2021-08-02 13:01:55 | VUE
• VUE3-36-组合式 API 提供/注入
  提供/注入 我们也可以在组合式 API 中使用 provide/inject。两者都只能在当前活动实例的 setup() 期间调用。 设想场景 假设我们要重写以下代码，其中包含一个 MyMap 组件，该组件使用组合式 API 为 MyMarker 组件提供用户的位置。 <!-- src/components/MyMap.vue --> <template> ...
  2021-08-02 13:01:55 | VUE
• VUE3-35-Setup
  参数 使用 setup 函数时，它将接受两个参数： props context 让我们更深入地研究如何使用每个参数。 Props setup 函数中的第一个参数是 props。正如在一个标准组件中所期望的那样，setup 函数中的 props 是响应式的，当传入新的 prop 时，它将被更新 // MyBook.vue export default { props: { ...
  2021-08-02 13:01:55 | VUE
• VUE3-34-什么是组合式 API？
  什么是组合式 API？ 通过创建 Vue 组件，我们可以将接口的可重复部分及其功能提取到可重用的代码段中。仅此一项就可以使我们的应用程序在可维护性和灵活性方面走得更远。 然而，我们的经验已经证明，光靠这一点可能是不够的，尤其是当你的应用程序变得非常大的时候——想想几百个组件。在处理如此大的应用程序时，共享和重用代码变得尤为重要。 假设在我们的应用程序中，我们有一个视图来显示某个用户的仓...
  2021-08-02 13:01:55 | VUE
• VUE3-33-响应式计算和侦听
  计算值 有时我们需要依赖于其他状态的状态——在 Vue 中，这是用组件计算属性处理的，以直接创建计算值，我们可以使用 computed 方法：它接受 getter 函数并为 getter 返回的值返回一个不可变的响应式 ref 对象。 const count = ref(1) const plusOne = computed(() => count.value++) consol...
  2021-08-02 13:01:55 | VUE