![](https://img-blog.csdnimg.cn/20201130144728917.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue3
Vue3
IDeaL乄
这个作者很懒,什么都没留下…
展开
-
Vue中使用AOS.js滚动动画库
1.npm install aos --save2.在main.js中:import AOS from "aos";import "../node_modules/aos/dist/aos.css";Vue.use(AOS);3.初始化:AOS.init()4.例:<div data-aos="fade-up" data-aos-duration="2000">更多效果在AOS.js官网浏览。原创 2020-12-18 15:36:57 · 4044 阅读 · 1 评论 -
Vue中引入和使用animate.css
1.npm install animate.css --save2.在main.js中import animated from 'animate.css' Vue.use(animated)3.标签中使用(注意是两个下划线),如:// 想要动画生效,animate__animated是必带类名<div class="animate__animated animate__fadeInUp"></div>4.动画效果标签...原创 2020-12-18 15:31:18 · 1533 阅读 · 1 评论 -
VueCli3 @路径设置
1.最外层目录创建文件vue.config.js2.加入如下代码let path = require('path')function resolve (dir) { return path.join(__dirname, dir)}module.exports = { chainWebpack: config => { config.resolve.alias .set('@', resolve('src')) }}...原创 2020-12-18 15:13:31 · 2593 阅读 · 2 评论 -
3.Vue3的生命周期
Vue3的生命周期1.Vue2已有的钩子函数和Vue3的部分钩子函数对比[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Ff149HOS-1606718667775)(D:\Typora\resources\Vue3\image-20201130104152877.png)]2.新旧钩子使用原则Vue 官方的文档里,明确指出了。如果你使用 Vue3,请尽量使用新的生命周期钩子函数3.Vue3新钩子函数onRenderTracked()和onRenderTriggere原创 2020-11-30 14:44:12 · 976 阅读 · 0 评论 -
2.Vue3的核心api特性以及使用方式
Vue3的核心api特性以及使用方式1.reactive理解:接收一个复杂数据类型并返回该类型的响应式代理。<template> <div> {{ count.value }} <button @click.prevent="Add">Add</button> </div></template><script lang="ts">import { defineComponent, rea原创 2020-11-30 14:41:05 · 249 阅读 · 0 评论