随笔分类 -  07、vue.js

vue - 实战项目 - 在线翻译
摘要：本来打算今天上午把这个案例写好的，结果上午昏昏欲睡，毫无动力，中午吃完饭就打王者荣耀，玩到下午三点多，队友不给力，自己又太坑实在太累了就睡了一觉，醒来到了六点了，我去！ 好了，废话少说。我先介绍下这个案例--效果：左侧输入一种语言，右侧选择要转换的语言，点击翻译就可以得到结果！是不是很神奇！当然博主 阅读全文
posted @ 2018-08-07 00:07 甘劭 阅读(1678) 评论(2) 推荐(0)
vue - 路由精讲 - 代码抽离和复用router-view
摘要：1.将之前所写的main.js中的 路由代码 进行抽离 首先我们在src文件夹下建立一个routes.js文件，然后把 import 引入Home 组件开始，一直到三级路由中PersonName组件得代码和 const routers = [ ] 代码抽离到 routes.js 中。只要在抽离后的r 阅读全文
posted @ 2018-08-05 16:56 甘劭 阅读(2117) 评论(0) 推荐(0)
vue-路由精讲-导航守卫
摘要：路由跳转前做一些验证，比如登录验证，是网站中的普遍需求。 对此，vue-route 提供的 beforeRouteUpdate 可以方便地实现导航守卫（navigation-guards）。 导航守卫（navigation-guards）这个名字，听起来怪怪的，但既然官方文档是这样翻译的，就姑且这么 阅读全文
posted @ 2018-08-05 15:35 甘劭 阅读(527) 评论(0) 推荐(0)
vue-路由精讲 - 二级路由和三级路由
摘要：1.我们继续上一个案例 vue -- 路由精讲制作导航 -- 从无到有 ，在 about文件夹下 创建一些文件夹。如下： 2. 编写about.vue代码。当我们点击导航中 “关于我们” ，就会显示该部分内容。代码中写了四个可供点击后可以跳转的模块。和 <router-view></router-v 阅读全文
posted @ 2018-08-05 09:51 甘劭 阅读(29498) 评论(0) 推荐(1)
vue -- 路由精讲制作导航 -- 从无到有
摘要：1.搭建脚手架 因为全局安装vue-cli 脚手架，在之前就已经安装好了。所以我们直接在桌面的projects文件夹下创建新项目。 在命令行输入：vue init webpack-simple pizza-app 然后cd pizza-app, 安装cnpm,最后运行。 然后创建所需要的文件夹如下： 阅读全文
posted @ 2018-08-03 18:07 甘劭 阅读(4628) 评论(0) 推荐(0)
Vue.js的常用指令
摘要： 阅读全文
posted @ 2018-08-03 14:03 甘劭 阅读(141) 评论(0) 推荐(0)
Hello World示例
摘要： 阅读全文
posted @ 2018-08-03 14:02 甘劭 阅读(136) 评论(0) 推荐(0)
认识vue.js项目目录文件
摘要： 阅读全文
posted @ 2018-08-03 14:01 甘劭 阅读(181) 评论(0) 推荐(0)
vue入口文件main.js
摘要： 阅读全文
posted @ 2018-08-03 14:01 甘劭 阅读(654) 评论(0) 推荐(0)
MVVM
摘要： 阅读全文
posted @ 2018-08-03 13:59 甘劭 阅读(132) 评论(0) 推荐(0)
vue.js 开发环境的搭建脚手架cli
摘要： 阅读全文
posted @ 2018-08-03 13:58 甘劭 阅读(107) 评论(0) 推荐(0)
vue.js 的插件 vue-resource
摘要：vue-resource Vue.js是数据驱动的，这使得我们并不需要直接操作DOM，如果我们不需要使用jQuery的DOM选择器，就没有必要引入jQuery。vue-resource是Vue.js的一款插件，它可以通过XMLHttpRequest或JSONP发起请求并处理响应。也就是说，$.aja 阅读全文
posted @ 2018-08-03 11:44 甘劭 阅读(591) 评论(0) 推荐(0)
Vue.js之路由
摘要：Vue.js之路由 以前的跳转都是使用a标签，a标签里有一个属性叫href，给他一个对应的网络地址或者一个路径的话，它就会帮助跳转到对应的页面。 Vue.js的路由，其实跟我们的a标签实现的功能是一样的，我们也是实现一个对应的跳转，只不过路由的性能更优化，a标签不管点击多少次，都会发生对应的网络请求 阅读全文
posted @ 2018-08-03 09:32 甘劭 阅读(257) 评论(0) 推荐(0)
vue.js 生命周期
摘要：生命周期 什么是生命周期 Vue实例有一个完整的生命周期，也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程，我们称这是Vue的生命周期。通俗说就是Vue实例从创建到销毁的过程，就是生命周期。 在Vue的整个生命周期中，它提供了一系列的事件，可以让我们在事件触发时 阅读全文
posted @ 2018-07-26 19:40 甘劭 阅读(283) 评论(0) 推荐(0)
vue.js 组件传值
摘要：vue.js 组件传值：属性传值可以从父组件到子组件，也可以从子组件到父组件。 父组件到子组件的传值 demo里有APP.vue是父组件，Header.vue，Users.vue和Footer.vue为子组件，Users.vue中的数据有个数组，现在把数组放到父组件App.vue中 App.vue文 阅读全文
posted @ 2018-07-26 16:51 甘劭 阅读(269) 评论(0) 推荐(0)