Vue基础

文章目录

列表渲染

字典渲染

通过key管理状态

事件处理

内联事件

方法事件处理器

事件传参

event 获取对象

传递事件对象

事件修饰符

阻止默认事件

组织事件冒泡

数组变化监听

变更法

替换一个数组

计算属性


class绑定

绑定对象

多对象绑定

数组绑定


数组和对象对class绑定,一般不用

style

绑定对象

监听器


表单输入绑定

复选框


模板引用

组件


组件导入

组件style scoped 样式生效作用域

组件嵌套关系

组件注册

全局注册

局部注册

组件传递数据_Props

父级传给子级

父级写法

父级动态传递

子级写法

组件传递数据

组件传递Props校验

子组件中校验


子组件中设置默认值

数组和对象用函数返回

必选项

props是只读的,不能修改父元素的数据

组件事件传递

父级写法

子级写法

组件事件配合v-model使用

组件数据传递

利用函数

透传属性

禁用透传属性

子组件中

插槽

父组件写法

子组件写法

插槽渲染作用域是父组件的

具名插槽

父级写法

简写

子级写法

同时使用父级和子级的作用域的数据

父级写法

子级写法

组件生命周期




组件生命周期应用

通过ref读取元素结构

动态组件

组件保持存活

异步组件

依赖注入


祖宗级写法使用provide

子孙级写法 inject

全局读取

应用


引入第三方

https://swiperjs.com/vue

npm install --save swiper@8.1.6

例子

Axios网络请求

npm install --save axios

get

post

需要装一个querystring


挂载到全局

封装axios

构建instance

发送请求之前

获取数据之前

错误状态码

跨域

解决方案


路由

异步加载

路由传递参数



二级导航


vuex store


状态管理核心

Getter

mutation


action


element-plus

element-plus图标

相关推荐
IT_陈寒5 分钟前
Python的列表推导式里藏了个坑,差点让我加班到凌晨
前端·人工智能·后端
吴声子夜歌13 分钟前
ES6——正则的扩展详解
前端·mysql·es6
天若有情67335 分钟前
【C++原创开源】formort.h:一行头文件,实现比JS模板字符串更爽的链式拼接+响应式变量
开发语言·javascript·c++·git·github·开源项目·模版字符串
天***885238 分钟前
Edge 浏览器离线绿色增强版+官方安装包,支持win7等系统
前端·edge
漫游的渔夫1 小时前
别再直接 `json.loads` 了!AI 返回的 JSON 坑位指南
前端·人工智能
软件工程师文艺1 小时前
从0到1:Claude Code如何用React构建CLI应用
前端·react.js·前端框架
M ? A1 小时前
Vue 迁移 React 实战:VuReact 一键自动化转换方案
前端·vue.js·经验分享·react.js·开源·自动化·vureact
yuki_uix1 小时前
重排、重绘与合成——浏览器渲染性能的底层逻辑
前端·javascript·面试
Burt1 小时前
我的 2026 全栈选型:Vue3 + Elysia + Bun + AlovaJS
vue.js·全栈·bun
止观止2 小时前
拥抱 ESNext:从 TC39 提案到生产环境中的现代 JS
开发语言·javascript·ecmascript·esnext