vue | IT懒猫 - 技术成就梦想

catroom

catroom

学习给人智慧，对真理而言，信服比流言更危险。

Vue3 混入

Vue3 混入混入 (mixins)定义了一部分可复用的方法或者计算属性。混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被混入该组件本身的选项。来看一个简单的实例：实例 // 定义混入对象 const myMixin = { created() { this.hello() }, methods: { hello() { co...

Vue3教程 2023-02-28 203 标签: vue

阅读详细

Vue3 路由

Vue3 路由 Vue 路由允许我们通过不同的 URL 访问不同的内容。通过 Vue 可以实现多视图的单页 Web 应用（single page web application，SPA）。 Vue.js 路由需要载入 vue-router 库中文文档地址：vue-router 文档。安装 1、直接下载 / CDN https://unpkg.com/vue-router@4 NPM 推荐使...

Vue3教程 2023-03-14 203 标签: vue

阅读详细

Vue3 自定义指令

Vue3 自定义指令除了默认设置的核心指令( v-model 和 v-show ), Vue 也允许注册自定义指令。下面我们注册一个全局指令 v-focus, 该指令的功能是在页面加载时，元素获得焦点：实例 <div id="app"> <p>页面载入时，input 元素自动获取焦点：</p> <input v-f...

Vue3教程 2023-02-28 184 标签: vue

阅读详细

Vue3 事件处理

Vue3 事件处理我们可以使用 v-on 指令来监听 DOM 事件，从而执行 JavaScript 代码。 v-on 指令可以缩写为 @ 符号。语法格式： v-on:click="methodName" 或 @click="methodName" v-on <div id="app"> <button @click...

Vue3教程 2023-02-28 206 标签: vue

阅读详细

Vue3 样式绑定

Vue3 样式绑定 Vue.js class class 与 style 是 HTML 元素的属性，用于设置元素的样式，我们可以用 v-bind 来设置样式属性。 v-bind 在处理 class 和 style 时，表达式除了可以使用字符串之外，还可以是对象或数组。 v-bind:class 可以简写为 :class。 class 属性绑定我们可以为 v-bind:class 设置一个对象，...

Vue3教程 2023-02-28 241 标签: vue

阅读详细

Vue3 监听属性解析

Vue3 监听属性 Vue3 监听属性 watch，我们可以通过 watch 来响应数据的变化。以下实例通过使用 watch 实现计数器：实例 <div id = "app"> <p style = "font-size:25px;">计数器: {{ counter }}</p> <butto...

Vue3教程 2023-02-28 254 标签: vue

阅读详细

Vue3 计算属性解析

Vue3 计算属性计算属性关键词: computed。计算属性在处理一些复杂逻辑时是很有用的。可以看下以下反转字符串的例子：实例 1 <div id="app">{{ message.split('').reverse().join('') }} </div> 实例 1 中模板变的很复杂起来，也不容易看懂理解。接下来我们看看使用了计算属性的实...

Vue3教程 2023-02-28 234 标签: vue

阅读详细

Vue3 组件

Vue3 组件组件（Component）是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。组件系统让我们可以用独立可复用的小组件来构建大型应用，几乎任意类型的应用的界面都可以抽象为一个组件树：每个 Vue 应用都是通过用 createApp 函数创建的，传递给 createApp 的选项用于配置根组件。当我们挂载应用时，该组件被用作渲染的起点。一个应用需...

Vue3教程 2023-03-14 245 标签: vue

阅读详细

Vue3 循环语句 v-for

Vue.js 循环语句循环使用 v-for 指令。 v-for 指令需要以 site in sites 形式的特殊语法， sites 是源数据数组并且 site 是数组元素迭代的别名。 v-for 可以绑定数据到数组来渲染一个列表： v-for 实例 <div id="app"> <ol> <li v-for="site...

Vue3教程 2023-03-14 200 标签: vue

阅读详细

Vue3 条件语句 v-if v-else-if

Vue3 条件语句条件判断 v-if: 条件判断使用 v-if 指令，指令的表达式返回 true 时才会显示： v-if 指令在元素中使用 v-if 指令： <div id="app"> <p v-if="seen">现在你看到我了</p> </div> <script> const app =...

Vue3教程 2023-03-14 315 标签: vue

阅读详细

user_photo default icons

catroom

学习给人智慧，对真理而言，信服比流言更危险。

热门文章

最新文章