全部文章
JavaScript
CSS
Vue.js
npm
Node.js
Webpack
Apache
PHP
MySQL
App开发
HTTP
RESTful API
Git
数据结构和算法
正则表达式
Windows
CentOS
macOS
微信支付宝
FFmpeg
UI 设计
PS 手绘
Adobe 全家桶
大杂烩
vue-router 页面跳转后如何记录返回后的位置
前两种方法需要设置路由history模式，后两种方法貌似更合适。
方法一：
1.在router.js里面（即路由文件中），此时模式为 history
const router = new VueRouter({
mode: 'history',
routes,
scrollBehavior (to, from, savedPosition) {
if (savedPosition) {
return savedPosition
} else {
if (from.meta.keepAlive) {
vue-router 切换页面时设置过渡动画
实现难点
如何判断切换路由时是前进还是后退
每次向左向右切换动画如何实现
解决方案
我们需要给各个页面定义层级,在切换路由时判断用户是进入哪一层页面,如果用户进入更高层级那么做前进动画,如果用户退到低层级那么做后退动画.
router/index.js
import VueRouter from 'vue-router'
import Home from '../components/home/home'
import User from '../components/user/user'
var router = new VueRouter({
routes
vue.js 怎么给v-html指令绑定的数据添加样式
在Vue组件中，使用.foo img{max-width:100%}不会生效，解决方法如下：
.foo { height: 300px; }
而如果在组件中使用了v-html，要为myHtml中的标签添加CSS样式，我们需要在写样式的时候添加>>>：
.foo >>> img { max-width: 100%; }
这样，编译时以上CSS才会被编译为
.foo[data-v-xxxxxxx] img { max-width: 100%; }
Vuex中的信息，刷新页面后，数据没有了的解决方案
解决方案一，检查Vuex中的数据，没有的话，重新从服务器获取，该方案可以满足存储的简单信息。该方法的好处是比较干净。
mounted: function(){
var that = this;
//如果登录后，刷新了，vuex里的登录数据会清空，这里重新从服务器获取数据
if(tools.getCookie('token') && !this.$store.state.user.user_type){
// 判断不需要重新获取信息的页面
var noNeed = ['/login','/register','/reset'];
va
Vue2.5中，父组件created钩子异步获取数据，子组件没有更新绑定的参数
问题描述：
父组件传如lesser和larger两个参数，并且是ajax从服务器获取的。子组件定义created阶段输出lesser和larger。但larger为空。改成延迟输出则正确。
问题来源：https://segmentfault.com/q/1010000008912491
提问者的主要问题是没有搞清楚，vue实例的生命周期，created函数只会执行一次。
父组件：
export default {
data(){
return {
lesser:'lesser',
larger:''
},
mint-ui中的cell无法绑定原生事件
这样才能正常绑定事件test，去掉is-link也可以绑定，如下：
原因如下：Vue.js官方文档中：https://cn.vuejs.org/v2/guide/components-custom-events.html#将原生事件绑定到组件给组件绑定原生事件有时候，你可能想在某个组件的根元素上监听一个原生事件。可以使用 v-on 的修饰符 .native。例如：
进一步解释，原生就类似于你直接用$element.addEventListener(click, callback);
绑定事件。router-link会阻止click事件，你可以试试只用click
为什么Axios ajax每次patch都会有两次网络请求？
OPTIONS请求是信使请求，在跨域请求之前，浏览器会先发送OPTIONS请求去获取服务器请求访问头，如果OPTIONS请求被拒绝，则不会继续后续的GET/POST/PUT/PATCH等操作。前面请求，由于只是去探路的，只请求数据头部，所以返回空是正常的。如果前面的OPTIONS访问的头部信息被服务器拒绝，那么后面一次请求就不会被发起。这个是HTTP自身的特性，不用特意去处理，如果是自己的服务器的话，只需要在后台给所有的OPTIONS类型请求返回空就可以了（这只是以防万一，因为OPTIONS只请求数据头部，总是会返回空）。网上找到这个说法：https://segmentfault.com/q/
vue.js国际化 vue-i18n插件
安装方法1.使用CDN直接引用
2.NPM$npminstallvue-i18n3.Yarn$yarnaddvue-i18n使用方法在这里只介绍vue的使用方法
/*国际化使用规则*/
importVuefrom'vue'
importVueI18nfrom'vue-i18n'
Vue.use(VueI18n)
constmessages={
en:{
message:{
hello:'worldhello'
}
},
zh:{
message:{
hello:'世界'
}
}
}
co
Vue.js 如何添加全局函数或变量?
插件util.js
exportdefault{
install(Vue,options)
{
Vue.prototype.getData=function(){
console.log('我是插件中的方法');
}
}
}main.js 引入 并且全局注册importutilfrom'./util'
Vue.use(util);其他组件中使用this.getData();参考：https://cn.vuejs.org/v2/guide/plugins.html#使用插件https://www.zhihu.com/question/4050
实现一个属于我们自己的简易MVVM库
前言本文所有代码都已经push到本人github个人仓库overwrite->my-mvvm我们知道的，常见的数据绑定的实现方法1、数据劫持(vue)：通过Object.defineProperty()去劫持数据每个属性对应的getter和setter2、脏值检测(angular)：通过特定事件比如input，change，xhr请求等进行脏值检测。3、发布-订阅模式(backbone)：通过发布消息，订阅消息进行数据和视图的绑定监听。具体代码实现可以参考我github个人仓库overwrite->my-observer一言不合先上代码和效果图吧codeexample{{b}}{{a}}cha
在Vue项目中添加Stylus
三种CSS 预处理器（框架）历史：SASS 2007年诞生，最早也是最成熟的CSS预处理器，拥有ruby社区的支持和compass这一最强大的css框架，目前受LESS影响，已经进化到了全面兼容CSS的SCSS。LESS2009年出现，受SASS的影响较大，但又使用CSS的语法，让大部分开发者和设计师更容易上手，在ruby社区之外支持者远超过SASS，其缺点是比起SASS来，可编程功能不够，不过优点是简单和兼容CSS，反过来也影响了SASS演变到了SCSS的时代，著名的Twitter Bootstrap就是采用LESS做底层语言的。Stylus，2010年产生，来自Node.js社
axios跨域访问
axios 的跨域问题，分以下几种情况：
1、 server 端不支持跨域，比如遇到下面的错误就是这种情况
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://xxx.com' is therefore not allowed access.
解决方案：如果 server 端是自己开发的，那么修改相关代码支持跨域即可。如果不是自己开发的，那么可以自己写个后端转发该请求，用代理的方式实现。
2、 serv
Vue和Ajax的关系，Axios简介
Vue 原本有一个官方推荐的 ajax 插件 vue-resource，但是自从 Vue 更新到 2.0 之后，官方就不再更新 vue-resource目前主流的 Vue 项目，都选择 axios 来完成 ajax 请求，而大型项目都会使用 Vuex 来管理数据，所以这篇博客将结合两者来发送请求vue官方原话：最近团队讨论了一下，Ajax 本身跟 Vue 并没有什么需要特别整合的地方，使用 fetch polyfill 或是 axios、superagent 等等都可以起到同等的效果，vue-resource 提供的价值和其维护成本相比并不划算，所以决定在不久以后取消对 vue-r
vue-router的几种使用方式
一，基础的vue spa入口函数是这样的：importAppfrom'./App.vue'
newVue({
el:'#app',
render:h=>h(App)
})二，如果只需要非常简单的路由而不需要引入整个路由库，可以动态渲染一个页面级的组件像这样：来自官方文档的例子：constNotFound={template:'Pagenotfound'}
constHome={template:'homepage'}
constAbout={template:'aboutpage'}
constr
