2018年09月_凌冰_

原创 VueJs 调试工具——vue-devtools

文件下载地址第一步将下载好的文件拖到chrome拓展栏中（更多工具=>拓展程序）第二步修改配置文件：C:\Users\Administrator\AppData\Local\Google\Chrome\User Data\Default\Extensions\nhdogjmejiglipccpnnnanhbledajbpd\3.1.2_0如图：打开文件“man...

2018-09-25 11:48:39 413

原创 Vue.js框架--嵌套路由（二十）

主要操作技能嵌套路由就是 (路由里面嵌套他的子路由) 子路由关键属性children 1）配置路由{ path: '/user', component: Users, children: [{ //父子组件配置,注意不能写/ path: 'useradd', ...

2018-09-21 11:39:12 300

原创 Vue.js框架--路由编程式的导航和History 模式（十九）

主要操作技能：https://router.vuejs.org/zh一、编程式的导航除了使用 <router-link> 创建 a 标签来定义导航链接，我们还可以借助 router 的实例方法，通过编写代码来实现点击 <router-link :to="..."> 等同于调用 router.push(...)。 //...

2018-09-19 17:29:04 200

原创 Vue.js中的 new Vue() 和 export default {}区别

在生成、导出、导入、使用 Vue 组件的时候，常常被位于不同文件的 new Vue() 和 export default{} 。首先，Vue 是什么？ po 主的理解是 Vue 就是一个构造函数，生成的实例是一个巨大的对象，可以包含数据、模板、挂载元素、方法、生命周期钩子等选项。所以渲染的时候，可以使用构造 Vue 实例的方式来渲染相应的 html 页面：...

2018-09-18 11:56:44 10405

转载 web本地存储localStorage与sessionStorage区别

对浏览器来说，使用 Web Storage 存储键值对比存储 Cookie 方式更直观，而且容量更大，它包含两种：localStorage 和 sessionStorage sessionStorage（临时存储）：为每一个数据源维持一个存储区域，在浏览器打开期间存在，包括页面重新加载 localStorage（长期存储）：与 sessionStorage 一样，但是浏...

2018-09-17 16:59:25 247

原创 Vue.js框架--路由并请求数据实现新闻列表及详情（十八）

主要操作技能：(1) 提供对外的接口新闻列表接口：http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1新闻详情接口：http://www.phonegap100.com/appapi.php?a=getPortalArticle&aid=488(2)安装请求数据cnpm ...

2018-09-16 16:06:37 3721

原创 Vue.js框架--动态路由Get传值（十七）

主要操作技能：官网https://router.vuejs.org/中文网https://router.vuejs.org/zh/guide/一、不同路由传值:动态路由1>配置路由 routes:[ //动态路径参数,以冒号开头 {path:'/detail/:aid',component:Detail} ]2>在对应的页面获取路由的值this....

2018-09-16 14:03:51 250

原创 Vue.js框架--路由（十六）

主要操作技能：官网https://router.vuejs.org/中文网https://router.vuejs.org/zh/guide/vue路由配置： 1.安装 cnpm install vue-router --save /npm install vue-router --save 2.引入并Vue.use(VueRouter) (在main....

2018-09-10 16:37:41 176

转载 Vue.js面试题整理

一、什么是MVVM？MVVM是Model-View-ViewModel的缩写。MVVM是一种设计思想。Model 层代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑；View 代表UI 组件，它负责将数据模型转化成UI 展现出来，ViewModel 是一个同步View 和Model的对象（桥梁）。在MVVM架构下，View 和 Model 之间并没有直接的联系，而是通过Vie...

2018-09-07 16:07:02 30905 4

原创 Vue.js框架--非父子组件传值（十五）

主要操作技能： Home.vue / News.vue 不是父子关系 * 非父子组件传值 * 1.新建一个js文件,然后引入vue, 实例化vue, 最后暴露给这个实例==> VueEvent.js * * 2.在要广播的地方引入实例 import VueEvent from '../model/VueEvent.js'...

2018-09-07 11:52:25 155

转载 Vue.js基础语法小结

Vue.js是一个数据驱动的web界面库。Vue.js只聚焦于视图层，可以很容易的和其他库整合。代码压缩后只有24kb。以下代码是Vue.js最简单的例子，当 input 中的内容变化时，p 节点的内容会跟着变化。 1 2 3 4 5 6 7 8 9 10 11 <!-- h...

2018-09-06 10:45:58 204

转载 Vue.js中 computed和methods不同机制

在vue.js中，有methods和computed两种方式来动态当作方法来用的1.首先最明显的不同就是调用的时候，methods要加上（）2.我们可以使用 methods 来替代 computed，效果上两个都是一样的，但是 computed 是基于它的依赖缓存，只有相关依赖发生改变时才会重新取值。而使用 methods ，在重新渲染的时候，函数总会重新调用执行为了方便理...

2018-09-05 17:18:52 195

原创 Vue.js框架--父组件与子组件交互数据（十四）

主要操作技能： 1、父组件主动获取子组件的数据和方法 * 1>调用子组件的时候定义一个ref <v-header ref='header'></v-header> 2>在父组件中通过 * this.$refs.header.属性 * * th...

2018-09-04 17:28:29 152

原创 Vue.js框架--父组件传属性和方法给子组件、父组件传整个对象给子组件（十三）

主要操作技能： 1 .父组件调用子组件的时候，绑定动态属性 <v-header :title="title"></v-header> 2.在子组件中通过props来接受父组件传的数据 props: ['title','msg','run','home'] props: { //可以指定属性具体的数据类型...

2018-09-04 16:20:27 3903

原创 Vue.js框架--axios请求数据（十二）

主要操作技能： vue本身是不支持发送ajax请求，需要通过其他库来实现的（比如vue1.0版本官方推荐的vue-resource、vue2.0版本官方推荐的axios），或者也可以使用jquery来发送ajax请求; vue2.0版本已经不推荐vue-resurce了，官方推荐axios来发送, 先了解的是axios是一个基于Promise的HTTP请求客户...

2018-09-04 14:33:25 265

原创 Vue.js框架--插件vue-resource请求数据（十一）

主要操作技能： 1. 通过https://github.com/ 查找 vue-resource插件 2 .使用vue-resource请求数据的步骤：. 2.1)需要安装 vue-resource模块，注意加上--save npm install vue-resource --save/cnpm install vue-resourc...

2018-09-04 12:07:57 300

原创 Vue.js框架--组件的生命周期函数（十）

主要操作技能： 1. 生命周期函数的的定义：就是组件挂载、以及组件更新、组件销毁的时候触发的一系列方法。也叫生命周期钩子 2. 生命周期图示：编写代码： Lify.vue组件<template> <div id="life"> 生命周期函数的使用！ -->{{msg}}<b...

2018-09-04 10:51:25 235

原创 Vue.js框架--创建单个组件和组件的使用（九）

主要操作技能： 1.创建单个组件 2.应用组件步骤 a）引入组件 import Home from './components/Home.vue'; b）挂载组件 components: { 'v-home': Home } c）在模板中使用组件 ...

2018-09-03 16:45:16 861

分享我的点点滴滴，在成长路上与你同行！