【Vue.js】SPA】的更多相关文章

SPA 2019-11-13  23:20:48  by冲冲 1.概念 (1)MPA(multi-page application) 特点:每一次页面跳转的时候,后台服务器都会返回一个新的html文档,这种类型的网站就是多页网站,也叫多页应用. (2)SPA(single-page application) ① 原理:第一次进入页面时就会加载相应的HTML.JavaScript 和 CSS,需要切换内容时,通过JavaScript感知url变化,更换当前页面内容,但是并没有新的html文件请求.…
[问题描述] 把当前用户的购物车中(cartList),商品(good)选中字段checked = true的商品在订单页面中进行展示出来. [一般做法](两次循环) 首先取出当前用户的购物车列表,循环里面的item,如果item=true,就把当前的商品加到orderList数组中,然后通过展示订单列表的DOM,通过v-if来对orderList数组进行展示出来. 这种作发明显使用了两个循环,一个循环是在方法里面循环,一个循环是在DOM中利用v-for进行循环. <template> <…
windows下搭建vue开发环境 Vue.js是一套构建用户界面的 “渐进式框架”.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合.2016年,Vue同Angular.React形成三足鼎立的局面,让前端的开发者顾不暇接,今天我们就来了解一下Vue的环境搭建. 一.node.js安装Vue项目通常通过webpack工具来构建,而webpack命令的执行是依赖node.js的环境的,所以首先要安装nod…
慕课网视频学习笔记:http://www.imooc.com/learn/694 1.将html.js.css写到一个后缀名.vue的文件中,区分这三种类型是通过<template>.<script>.<style>来区分,这个.vue文件在打包的过程中会被转换成浏览器能识别的传统html.js.css. 2.使用vue.js官方提供的命令行工具,可以让我们把关注点放在项目功能的实现上. 3.需要安装依赖(cnpm install),可进入package.json中查看…
1.架构从传统的MVC向REST API+前端MV*迁移 参考链接: http://blog.csdn.net/broadview2006/article/details/8615055 http://blog.csdn.net/u013628152/article/details/42709033 MV*包括:MVC.MVP.MVVM vue.js是MVVM框架 2.Iconmoon制作图标字体 2.1 点击IconMoon App 2.2点击import icons,导入svg图片 2.3选…
vue.js中有个v-model的语法,可以实现双向绑定. 起初刚看到的时候,觉得很神奇.后面随着对vue.js的熟悉.发现这个其实是vue官方给我们实现的一个语法糖. 使用v-model的时候,vue会绑定组件的value属性,在自定义组件上使用v-model,然后浏览器审查元素,就会发现组件上做了一个vue属性. 如果在组件做出修改的话,就可以直接发射一个input的事件,把对应的值弹出到外面,就实现了双向绑定 v-model用不用input这个标签其实都无所谓 父组件 <template>…
1. build文件夹:打包配置的文件夹 1.1  webpack.base.conf.js :打包的核心配置 1.2  build.js:构建生产版本,项目开发完成之后,通过build.js打包(加载base与prod,读取完之后通过webjpack命令对项目进行打包) 1.3  webpack.prod.conf.js:被build.js调用,webpack生产包的一个配置.基础代码都在1.1里面写,1.3是对1.1的扩展与补充 1.4  dev-client.js:热更新的插件,进行对客户…
引言 今天用到了一个加载更多的插件,用起来很方便,插件的名字叫做vue-infinite-scroll 我们可以去npmjs.com官网看一下这个vue-infinite-scroll的用法,官网上面写的已经很简单易懂的了. 安装 npm install vue-infinite-scroll --save 引入 官网介绍了三种引入该插件的方式,分别是Common js方式(require("XXXX")) . ES6语法方式(import xxx from xxx). 还有直接<…
一.搜素效果如下: 二.核心 1)利用oninput属性来触发搜素功能 2)利用RegExp来对字符串来全局匹配关键字,利用replace方法来对匹配的关键字进行嵌入高亮的<span class="gaoliang">标签,最后利用v-html来嵌入html标签来达到关键字高亮显示 3)利用axios.CancelToken来终止上一次的异步请求,防止旧关键字查询覆盖新输入的关键字查询结果. 三.代码 1)HTML  搜索框部分绑定input事件(搜索框独立出来,作为一个基…
1.vue 禁止浏览器后退需求是:需要某个路由不能通过浏览器返回,同时不影响相互之间的切换整理一下解决方法 和 使用方法: 1.在路由配置中给这个路由添加meta信息,比如: { path: '/home', component: xxx, meta: {allowBack: false} } 2.在全局的router.beforeEach 函数里面获取allowBack的状态,同时更新vuex的allowBack的值,如: let allowBack = true // 给个默认值trueif…