渐进式框架

mubassirameheja

这一原则意味着职责之间严格分离。单个组件仅完成一项任务，仅此而已。这确保了该组件可以通用。 Vue.js 简介 图 3 - 由模板、脚本和样式组成的 Vue.js 单文件组件示例 由模板、脚本和样式组成的 Vue.js 单文件组件示例 上面的代码显示了单个文件组件的三个部分： 作为 HTML 模板的标记 JavaScript 中的逻辑作为脚本 CSS 中的样式 这些单个文件组件现在可以以树状方式相互连接。有些人喜欢将其描述为乐高积木。组件之间通常的通信方式是父组件将 props 传递给其子组件，并且可以通过 emit 通知事件。这就是应用程序通常的结构： Vue.js 简介 图 4 - 描述 Web 应用程序的示例组件树 代表 Web 应用程序的示例组件树 模板 Vue.js 通常为您提供很大的设计自由度。从技术角度来看，使用 HTML、 JSX甚至Pug编写模板并不重要。


可以使用配置文件中的相应设置来转换方言。 使用脚本创建数据绑定的最简单 瑞士 电话号码 方法是“Mustache”语法，您已经从Handlebars中了解了该语法 自动将 data 属性的值 hello 插入到占位符中。如果您更改脚本中的问候语值，模板也会自动调整。为此，开发人员不再需要查询选择器并专门更改值。 还有其他可用的关键字和函数，包括视频秀 v-一次 v-html 文字 事件处理程序也可以直接添加到 HTML 标记中，例如： @点击 @click.prevent 用于自动调用 event.preventDefault() @click.stop 用于自动调用 要将动态值绑定到标签，请使用以冒号作为前缀的简写，处更详细地描述了模板中的选项。 脚本 Vue 组件可以全局或本地注册。这取决于项目的架构。




般来说，可以将以下选项传递给脚本： 数据绑定：这包括可与关键字 data、props、propsData、compulated、methods 和 watch 一起应用的反应式数据属性和方法。 DOM 绑定：根据您想要将 HTML 绑定到组件的方式，您可以使用 el、模板和渲染选项。 Lifecycle Hooks：除了计算值和方法之外，Vue.js 还有其他在特定时间执行的方法，例如创建、安装、更新或销毁。 添加名称、对子组件和 mixins 的引用也可以容纳在脚本中。 信息：还有供 TypeScript 粉丝使用的加载器。下一个 Vue.js 版本 Vue 3 的核心甚至已经完全用 TypeScript 实现。 声明式渲染 在 hello.vue 的简化示例中（参见单个文件组件的上图），数据属性与键问候语一起存储。可以使用 Mustache 语法将其绑定到模板。这将数据和 DOM 连接起来，这种连接称为响应式连接。