vue2 手记

Vue文档:https://cn.vuejs.org/v2/api/#provide-inject

Vue 生命周期:https://cn.vuejs.org/v2/guide/instance.html

vuex状态管理:https://vuex.vuejs.org/zh/

1.简单循环

2.数组包含某值函数.includes()

3.获取路由

4. 获取数据类型

5.数据克隆

1.简单循环

1).

item:定义的每一条的变量

response.data.result:要循环的数组

for(let item of response.data.result) {
//用item操作每一条数据。
}

2).

response.data.result:要循环的数组

index:索引

response.data.result.forEach((item, index) => {
// 用item操作每一条数据。
})

  

2.数组包含某值函数.includes()

[1, 2, 3].includes(2); // true

[1, 2, 3].includes(4); // false

[1, 2, 3].includes(3, 3); // false

[1, 2, 3].includes(3, -1); // true

详细:https://www.cnblogs.com/rain-in-summer/p/9792165.html

3.获取路由

window.document.location.pathname // 亲测

this.$route.query

router.split('?')[1]

  

4. 获取数据类型

1)typeof

typeof data // 获取数据类型(array,object)

  或

typeof(a) //旧写法

2)isNaN

使用js自带全局函数isNaN(), isNaN()返回一个Boolean值,如下 :

var c="hello"; //字符串

isNaN(c); //返回一个true;

var c=10; //数字

isNaN(c);//返回一个false

如果以上c为一个空串或是一个空格,isNaN将把c当作数字0来处理,所以检查不严谨。

3)正则表达式

function checkNum(input){

var reg=/^[0-9]+.?[0-9]*$/; //判断字符串是否为数字 ,判断正整数用/^[1-9]+[0-9]*]*$/

var num=document.getElementById(input).value;

if(!reg.test(num)){

        alert("请输入数字");

    document.getElementById(input).value="";

    return false;

    }

}

  

5.数据克隆

1)

objClone=JSON.parse(JSON.stringify(obj))

2)

function deepClone (data) {
let type = typeof data
let obj
if (type === 'array') {
obj = []
} else if (type === 'object') {
obj = {}
} else {
// 不再具有下一层次
return data
}
if (type === 'array') {
for (let i = 0, len = data.length; i < len; i++) {
obj.push(deepClone(data[i]))
}
} else if (type === 'object') {
for (const key in data) {
if (key == 0) {
obj = []
}
if (!isNaN(key)) {
obj.push(deepClone(data[key]))
} else {
obj[key] = deepClone(data[key])
}
}
}
return obj
}

  

JS使用Cookie:https://www.cnblogs.com/cxscode/p/11177580.html

Vue2技术栈归纳与精粹:https://blog.csdn.net/sinat_17775997/article/details/78913968

vue2 手记的更多相关文章

  1. vue2 design 手记

    Ant Design of Vue github地址:https://github.com/vueComponent/ant-design-vue Ant Design of Vue文档:https: ...

  2. vue2.0实践的一些细节

    最近用vue2.0做了个活动.做完了回头发现,好像并没有太多的技术难点,而自己好像又做了比较久...只能说效率有待提升啊...简单总结了一些比较细节的点. 1.对于一些已知肯定会有数据的模块,先用一个 ...

  3. 用FSM一键制作逐帧动画雪碧图 Vue2 + webpack

    因为工作需要要将五六十张逐帧图拼成雪碧图,网上想找到一件制作工具半天没有找到,就自己用canvas写了一个. 写成之后就再没有什么机会使用了,因此希望有人使用的时候如果遇到bug了能及时反馈给我. 最 ...

  4. vue2.0构建淘票票webapp

    项目描述 之前一直用vue1.x写项目,最近为了过渡到vue2.0,特易用vue2.0栈仿写了淘票票页面,而且加入了express作为后台服务. 前端技术栈:vue2.0 + vue-router + ...

  5. Linux.NET实战手记—自己动手改泥鳅(上)

    各位读者大家好,不知各位读者有否阅读在下的前一个系列<Linux.NET 学习手记>,在前一个系列中,我们从Linux中Mono的编译安装开始,到Jexus服务器的介绍,以及如何在Linu ...

  6. Linux.NET学习手记(7)

    前一篇中,我们简单的讲述了下如何在Linux.NET中部署第一个ASP.NET MVC 5.0的程序.而目前微软已经提出OWIN并致力于发展VNext,接下来系列中,我们将会向OWIN方向转战. 早在 ...

  7. Linux.NET学习手记(8)

    上一回合中,我们讲解了Linux.NET面对OWIN需要做出的准备,以及介绍了如何将两个支持OWIN协议的框架:SignalR以及NancyFX以OwinHost的方式部署到Linux.NET当中.这 ...

  8. 关于《Linux.NET学习手记(8)》的补充说明

    早前的一两天<Linux.NET学习手记(8)>发布了,这一篇主要是讲述OWIN框架与OwinHost之间如何根据OWIN协议进行通信构成一套完整的系统.文中我们还直接学习如何直接操作OW ...

  9. U3D DrawCall优化手记

    在最近,使用U3D开发的游戏核心部分功能即将完成,中间由于各种历史原因,导致项目存在比较大的问题,这些问题在最后,恐怕只能通过一次彻底的重构来解决 现在的游戏跑起来会有接近130-170个左右的Dra ...

随机推荐

  1. .net core 2.2 EF oracle db first

    Nuget控制台: Install-Package log4net Install-Package Newtonsoft.Json Install-Package Autofac Install-Pa ...

  2. 使用极光第三方IM的时候服务器报错Caused by: java.net.UnknownHostException: api.im.jpush.cn

    Caused by: java.net.UnknownHostException: api.im.jpush.cn 服务器报这个:首先查看服务器是否能ping通,如果能ping通,则看下 vi /et ...

  3. mysq5.7 主主同步

    db01  172.21.0.10 db02  172.21.0.14 一.安装数据库看上一遍博客 修改配置文件  db01  172.21.0.10 [root@VM_0_10_centos mys ...

  4. 【Spring Cloud学习之四】Zuul网关

    环境 eclipse 4.7 jdk 1.8 Spring Boot 1.5.2 Spring Cloud 1.2 一.接口网关接口网关:拦截所有的请求,交由接口网关,然后接口网关进行转发,类似ngi ...

  5. SaltStack 是一个服务器基础架构集中化管理平台

    SaltStack详细部署   一.基础介绍============================================================================== ...

  6. panda读取Excel

    pandas读取Excel的第一种方法 方法一:默认读取第一个表单 import pandas print("\n方法一:") xls_data=pd.read_excel('ce ...

  7. 013 ECMAScript基础应用

    1.ECMAScript概述 (1)前端的发展历程 <1>web 1.0时代 最初的网页以HTML为主,是纯静态的网页.网页是只读的,信息流只能从服务的到客户端单向流通.开发人员也只关心页 ...

  8. Word 频繁无响应

    可以参考以下方法,这是我的解决办法,不保证对你也有用. 步骤一: 在「开始 > 运行」中输入「winword /a」进入无加载项 Word: 依次进入「Word 选项 > 高级 > ...

  9. C++中const限定符

    const基础 C++中的const,用于定义一个常量,这个常量的值不能被修改.因为const对象一旦创建就不能修改,所以const对象必须初始化.const常量特征仅仅在执行改变其本身的操作时才会发 ...

  10. Label&Button

    Button中的bg参数设置按钮背景颜色,fg参数设置字体颜色 pack中的fill参数告诉Packer让QUIT按钮占据剩余的水平空间,而expand参数则引导它填充整个水平可视空间,将按钮拉伸到左 ...