前端
前端学习
**猿来是你**
这个作者很懒,什么都没留下…
展开
-
Vue调试神器vue-devtools安装
chrome商店直接安装 vue-devtools可以从chrome商店直接下载安装,非常简单,这里就不过多介绍了。不过要注意的一点就是,需要翻墙才能下载。 手动安装 第一步点击谷歌浏览器的三点 第二步点击更多工具的扩展程序。 点击开发者模式-------------------->>>>>>>点击加载已解压的扩展的扩展程序 选择已存在的vue-d...原创 2020-04-25 17:22:54 · 90 阅读 · 0 评论 -
子组件
子组件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>vue组件</title> </head> <body> <div id="app"> <son><...原创 2020-04-25 17:21:35 · 126 阅读 · 0 评论 -
初学111vue-router
嵌套路由 <div id="app"> <!-- 跳转相应的路由--> <router-link :to="{path:'/home'}">首页</router-link> <router-link :to="{path:'/user'}">用户中心</router-link> <router-l...原创 2020-04-25 17:21:59 · 73 阅读 · 0 评论 -
新闻列表-导入导出-脚手架安装
新闻列表 <div id="app"> <!--模板的显示--> <router-view></router-view> </div> <!--定义一个新闻列表的模板--> <template id="newsList"> <div class="newsList"> &...原创 2020-04-25 17:22:12 · 141 阅读 · 0 评论 -
Vue组件补充及路由
Vue组件 全局组件 全局组件命令为:Vue.component 例如: //全局组件 Vue.component('home',{ template:'<div>首页</div>' }); Vue.component('user',{ template:'<div>用户中心</div>' ...原创 2020-04-25 17:20:53 · 110 阅读 · 0 评论 -
组件练习----学生管理系统
组件练习 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bo...原创 2020-04-25 17:20:42 · 308 阅读 · 0 评论 -
弹窗练习
弹窗练习 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>插槽</title> //写弹窗的样式 <style> *{ margin:0; ...原创 2020-04-25 17:21:46 · 150 阅读 · 0 评论 -
一、案例小结
案例一: <div id="app"> <h3>请输入你想要做的事</h3> <input type="text" v-model="mes" @keyup.enter="fn"> <ul> <li v-for="(item,index) in arr">//使用v-for循环迭代数组中的数据...原创 2020-04-25 17:20:30 · 4996 阅读 · 0 评论 -
监听器与异步更新和v-for
v-for 代码 div id="app"> <ul> <!-- <li v-for="item in arr">{{item}}</li>-->//循环迭代 <li v-for="(item,index) in arr">{{item}}-------{{index}}</li> //i...原创 2020-04-25 17:20:17 · 181 阅读 · 0 评论 -
Vue的生命周期和指令
Vue的生命周期 beforecreate(),此时有vue的实例,但是没有数据 create(),此时有vue的实例,data已经有数据了 但是数据没有挂载到视图中,数据没有挂载在根节点 beforemount(),此时根节点已经存在 但是数据还没有挂载到根节点 mount(),此时根节点已经存在,数据也挂载到根节点上 beforeUpdate 在数据改变之前触发 updated ...原创 2020-04-25 17:20:05 · 155 阅读 · 0 评论 -
初学vue_开始
vue学习开始 使用vue的的方法,必须得导入相应的vue的包 <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script> 测试,vue <body> <div id="app"> <!--<input type="te...原创 2020-04-25 17:23:04 · 104 阅读 · 0 评论