(33)Vue购物车
computed:{
lists(){
return this.$store.state.list
},
},
用v-model来双向绑定input控制checkbox是否选中
Vue中双向数据绑定是如何实现的
position的取值
static、relative、absolute、fixed、inherit、sticky
static标准文档流
relative相对于自身移动
fixed相对于body移动
inherit继承父级的position属性
absolute相对于离它最近的 position 属性为 absolute、relative或者 fixed 移动
sticky正常情况是static,超过设置的top,left变成fixed定位
什么是盒子模型?
由元素内容,border,margin,padding四部分组成盒子模型
行内元素有哪些?
a、b、span、img、input、strong、select、label、em、button、textarea
块级元素有哪些?
div、ul、li、dl、dt、dd、p、h1-h6、blockquote
空元素有那些?
br、meta、hr、link、input、img
src和href的区别?
src引入外部资源
href用于超链接
节点?
createDocumentFragment() //创建一个DOM片段
createElement() //创建一个具体的元素
createTextNode() //创建一个文本节点
appendChild() //添加
removeChild() //移除
replaceChild() //替换
insertBefore() //插入
getElementsByTagName() //通过标签名称
getElementsByName() //通过元素的Name属性的值
getElementById() //通过元素Id,唯一性
数组去重
[…new Set([1,2,3,1,‘a’,1,‘a’])]
使用正则表达式验证邮箱格式?
^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$
捕获先于冒泡。顶部捕获=>底部冒泡=>第二层捕获=>第二层冒泡。
viewport 是用户网页的可视区域
rem布局图片,宽高,布局等等
如何对数组去重
第一层for用来控制循环的次数
第二层for 用于控制与第一层比较的元素
如果相等
删除后面的 即第 j个位置上的元素 删除个数 1 个
function noRepeat1(arr){
// 第一层for用来控制循环的次数
for(var i=0; i<arr.length; i++){
//第二层for 用于控制与第一层比较的元素
for(var j=i+1; j<arr.length; j++){
//如果相等
if(arr[i] == arr[j]){
//删除后面的 即第 j个位置上的元素 删除个数 1 个
arr.splice(j,1);
// j--很关键的一步 如果删除 程序就会出错
//j--的原因是 每次使用splice删除元素时 返回的是一个新的数组
// 这意味这数组下次遍历是 比较市跳过了一个元素
/*
例如: 第一次删除后 返回的是 1 1 3 2 1 2 4
* 但是第二次遍历是 j的值为2 arr[2] = 3
* 相当于跳过一个元素 因此要 j--
* */
j--;
}
}
}
return arr;
}
单层for循环
function norepeat(arr){
arr.sort();
//先排序让大概相同的在一个位置,这里为什么说是大概相同 是因为sort排序是把元素当字符串排序的 它和可能排成 1 1 10 11 2 20 3 ... 不是我们想要的从小到大
for(var i = 0; i < arr.length-1;i++){
//还是两两比较 一样删除后面的
if(arr[i]==arr[i+1]){
arr.splice(i,1);
//i-- 和j--同理
i--;
}
}
return arr;
}
ES6 中新的 API — Array.from()
function normalize (arr) {
if (arr && Array.isArray(arr)) {
var res = Array.from(new Set(arr));
return res;
}
}
function normalize (arr) {
if (arr && Array.isArray(arr)) {
var res = [...new Set(arr)];
return res;
}
}
html,xml,xhtml的区别
XML 是 可扩展标记语言
HTML 是超文本标记语言
XHTML 是基于XML的 HTML, 作用与HTML相同
new与Object.create区别
var Base = function () {}
var o1 = new Base();
var o2 = Object.create(Base);
Object.create = function (o) {
var F = function () {};
F.prototype = o;
return new F();
};
new关键字必须是以function定义的
Object.create 则 function和object都可以进行构建
MVC 、MVVM、MVP的理解
Models: 数据层
View: 展示层
Controller: 控制器层
View只知道Presenter, 不知道Model 。Presenter去更新View
MVVM
数据模型的数据双向绑定
viewModel是一个同步view和model的对象
渐进式框架的理解
渐进式代表的含义是:主张最少
sessionStorage用于本地存储一个会话中的数据
sessionStorage不是一种持久化的本地存储
localStorage用于持久化的本地存储
除非主动删除数据,否则数据是永远不会过期的
Cookie的大小是受限的
同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。
同源
域名、协议、端口相同,也就是在同一个域里。
基本数据类型和引用数据类型
Number、String 、Boolean、Null和Undefined
引用类型数据:
比如:Object 、Array 、Function 、Data等
Vue2.0的生命周期有哪些?
1.beforeCreate
创建前的状态
2.created
实例创建完成后
3.beforeMount
挂钩前
4.mounted
挂载结束
5.beforeUpdate
数据变化前的调用
6.updated
数据变化后的钩子
7.beforeDestroy
实例销毁之前调用
8.destroyed
Vue 实例销毁后调用
v-show 与v-if的区别
v-show 有更高的渲染成本 v-if有更高的切换成本
什么是Vuex?
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。
HTTP(HyperText Transfer Protocol:超文本传输协议)是一种用于分布式、协作式和超媒体信息系统的应用层协议
HTTPS
HTTPS(Hypertext Transfer Protocol Secure:超文本传输安全协议或HTT Pover SSL)是一种透过计算机网络进行安全通信的传输协议
请点赞!因为你的鼓励是我写作的最大动力!
吹逼交流群:711613774
(33)Vue购物车的更多相关文章
- Vue购物车实例
<div class="buyCarBox" id="buyCarBox" v-cloak> <div class="haveClo ...
- vue 购物车练习
本人看了vue官网上的教程后,感觉对vue的依稀有点了解,决定动手练习个小功能项目,就找了购物车本项目.原文链接:http://blog.csdn.net/take_dream_as_horse/ar ...
- vue购物车和地址选配(三)
参考资料:vue.js官网 项目演示: 项目源代码: 核心代码及踩坑 删除: new Vue({ el:'#app', data:{ productlist:[], totalMoney:0, che ...
- vue购物车功能源码
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" ...
- Vue购物车
index.html <!DOCTYPE html><html> <head> <meta charset="utf-8&quo ...
- VUE购物车示例
代码下载地址:https://github.com/MengFangui/VueShoppingCart 1.index.html <!DOCTYPE html> <html lan ...
- vue购物车的实现
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue购物车动画效果
使用动画的三个函数 v-on:before-enter="beforeEnter" v-on:enter="enter" v-on:after-enter=&q ...
- 第八十三篇:Vue购物车(四) 总价计算
好家伙, 1.总价计算 来了,又先是一波分析: 我们用一个计算属性amt 我们把item中被勾选的项用一个过滤器过滤器来 然后用一个循环相加,把商品的价格乘以商品的数量, 把这个总值返回出去, 然后组 ...
随机推荐
- Sql 脚本文件太大 还原数据库
sql脚本太大直接在数据库中执行会提示内存不足,我们看生成的脚本文件会发现每隔100条会有一个GO来分隔,这就好说了 在我将数据库的结构连同数据生成一个脚本文件db.sql 后,想在另外的电脑上恢复数 ...
- ZIP压缩与解压
/**//* * Gary Zhang -- cbcye@live.com * www.cbcye.com * www.quicklearn.cn * cbcye.cnblogs.com */ usi ...
- JavaScript的变量和常量
1.什么是常量? 常量表示一些固定不变的数据 现实生活中人的性别其实就可以看做是常量, 生下来是男孩一辈子都是男孩, 生下来是女孩一辈子都是女孩 2.JavaScript中常量的分类 2.1整型常量 ...
- js实现图片上传本地预览
演示地址:https://xibushijie.github.io/static/uploadImg.html <!DOCTYPE> <html> <head> & ...
- 十七、存储过程&自定义函数详解
代码中被[]包含的表示可选,|符号分开的表示可选其一. 需求背景介绍 线上程序有时候出现问题导致数据错误的时候,如果比较紧急,我们可以写一个存储来快速修复这块的数据,然后再去修复程序,这种方式我们用到 ...
- MySQL Hardware--RAID卡BBU Learn Cycle
RAID卡缓存策略 不同的RAID卡缓存策略对IO的性能影响较大,常见的策略有: 1.写操作策略,可设置为WriteBack或WriteThrough WriteBack:进行写操作时,将数据写入RA ...
- python3+django+mysql
django 连接mysql默认驱动是MySQLdb,MySQLdb没有支持python3的版本,如果使用python3.x版本时,django连接mysql的方法 1.使用pymysql替换MySQ ...
- Android笔记(四十) Android中的数据存储——SQLite(二) insert
准备工作: 我们模拟一个注册的页面,先看UI 我们需要创建一个数据库:user,数据库包含表user,user表包含字段id.username.password.mobilephone MainAct ...
- MySQL学习之基础篇09-事务
我们在建表的时候通常会在最后声明引擎类型,这次我们就来看看存储引擎都有哪些: 举个例子: --------------------------- 银行转账: 张三想给李四转500元钱: 张三-500 ...
- QtCreator常用快捷键
1)帮助文件:F1 (光标在函数名字或类名上,按 F1 即可跳转到对应帮助文档,查看其详细用法) 2).h 文件和对应.cpp 文件切换:F4 3)编译并运行:Ctrl + R 4)函数声明和定义(函 ...