VueJS快速入门
关注
分享
扫一扫
VueJS快速入门,简单学习了解一一下vue
P_ning
一只小菜鸟的笔记
我的大部分笔记存放处在码云的仓库里面https://gitee.com/P_n_ing
有空的话我会把详细的步骤会写在这里
(当然是在我打完游戏后如果还有空闲的时间( ´◔ ‸◔`))
展开
-
组件的简单使用
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><!--导包--> </head> <body> <!--实际上,组件和vu原创 2020-06-04 20:45:20 · 168 阅读 · 0 评论 -
粗略了解Vue的生命周期
粗略了解生命周期 开头来一张官方文档上的图片先 可以看出在vue的整个生命周期中会有很多钩子函数提供给我们，然我们可以在不同的生命周期时刻进行操作，这些钩子函数分别有： beforeCreate created beforeMount mounted beforeUpdate updated beforeDestroy destroyed 首先先来一个简单案例 <!DOCTYPE html> <html> <head> <meta charset="ut原创 2020-06-03 20:37:56 · 110 阅读 · 0 评论 -
1_1_2_VueJS的基础操作续
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><!--导包--> </head> <body> <!--计算属性-->原创 2020-06-03 19:21:13 · 158 阅读 · 0 评论 -
VueJS笔记tips
因为这次的目的是快速的了解一下vueJS,所以在此处的所有VueJS的笔记都仅仅只是完成了功能,对于样式没有进行修饰,所以看起来非常抽,但是可以思想功能 ...原创 2020-03-16 21:04:18 · 115 阅读 · 0 评论 -
综合项目_音乐播放器
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>音乐播放器</title> <style type="text/css"> @keyframes rotate{ 0%{ transform: ...原创 2020-03-16 21:02:38 · 462 阅读 · 0 评论 -
2_3_天气预报
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>天气预报</title> </head> <body> <div id="weather"> <input v-model="city" pl...原创 2020-03-16 21:01:45 · 498 阅读 · 0 评论 -
2_2_获取笑话
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div id="demo"> <input type="button" value="获取笑...原创 2020-03-16 21:00:51 · 289 阅读 · 0 评论 -
2_1_axios的基础使用
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>axios的基础使用</title> </head> <body> <!-- 1.axios是基于ajax的 2.两种常见的方式: (1):...原创 2020-03-16 21:00:28 · 128 阅读 · 0 评论 -
1_4_简单记事本
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </h...原创 2020-03-13 12:26:04 · 305 阅读 · 0 评论 -
1_3_图片的切换
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>图片切换</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><...原创 2020-03-13 12:18:12 · 147 阅读 · 0 评论 -
1_2_添加和移除
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>添加和移除数据</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> ...原创 2020-03-13 12:14:59 · 213 阅读 · 0 评论 -
1_1_1_VueJS的基础操作
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- 使用vuejs框架首先导包: 开发环境版本<script src="https://cdn.jsdelivr.net/npm/vue/dis...原创 2020-03-13 12:14:15 · 227 阅读 · 0 评论