三个月前，我从React/Next.js前端开发转到了Vue 3前端开发。

虽然之前用过Vue 3，但这回我决定认真学习它。于是我订阅了@vueschool_io，开始学习他们的Vue.js 3基础知识与组合API课程。我当时想：“这都是基本内容，我什么都懂。”

但是，我大错特错了！

仅仅两节课，我就学到了一个看似微不足道却极其优雅的小技巧：

蓝湖代码转vue2.0+element-ui

将静态 Vue 页面(index.vue)改造为动态页面(Custom.vue)；稿源仅限 index.vue、其引用的 CSS 与资源路径，禁止参考仓库内其他文件。Invoke when user wants to transform a static Vue page into a dynamic data-driven page with Element UI components.

下载

<template>
  <span v-for="item in items" :key="item.id">
    {{ item.label }}
  </span>
</template>

在之前使用Vue的经历中，我竟然从未发现这个方法，总是采用更繁琐的方式：

<template>
  <span v-for="item in items" :key="item.id">
    {{ item.label }}
  </span>
</template>

这个小小的发现让我明白，认真学习框架的重要性。有时候，即使是最小的技巧也能带来巨大的提升。

您有哪些令人意想不到的编码技巧？欢迎在评论区分享！