关于vue开发的常见问题

一、vue单页面回退丢失参数的问题
可能有些跟我一样的新手同学会遇到一个问题，就是比如我从商品详情跳转到购物车，没问题，但是，购物车页面中点击浏览器的回退按钮，返回到detail页面时，你的动态数据（图片啊，名称啊，价格啊什么的）不见了，只剩下一堆css样式架子在那里，很难受。
这就是单页面回退参数丢失的问题，话不多说，直接说解决方法。
1、首先，我们需要了解一下Vuex。（状态管理）具体大家百度vuex

在vue-cli工程中
npm安装：npm i vuex --save

引入到项目mian.js中：
import Vuex from 'vuex'
Vue.use(Vuex);

定义一个常量
const store = new Vuex.Store({
    state: {
      songInfo:''
    },
    mutations: {
       //定义函数，比如我要获取songInfo
      getSongInfo(state, songInfo) {
          state.songInfo = songInfo;
      }
    }
});
然后全局的vue中加上去store
/* eslint-disable no-new */
    new Vue({
      el: '#app',
      router,
      store,
      components: { App },
      template: '<App/>'
   })
  这样，我们main.js的部分就做好了，那么页面部分怎么做呢
  我们既然要获取，就要先存
  在你存数据的vue页面中,id是参数，可以是数组，变量什么的，要不要看你自己需求
    save(id){
           //console.log(id);
           this.$store.commit("getSongInfo", id);
       }
  然后接下来就是在你想要获取数据的页面获取储存的东东了
  computed:{
    hereIsYourData(){
        return this.$store.state.songInfo;
    }
  }

为什么加了个computed计算属性呢？我觉得挺方便的。看看这里说的
https://cn.vuejs.org/v2/guide...
顺便你可以加深对watch和conputed的理解
计算属性默认只有 getter ，不过在需要时你也可以提供一个 setter
然后，解决完毕！嘻嘻嘻

二、webpack打包工程上线后，你发现开发者工具的source看到了源码
对，webpack上线配置错了。去到config文件夹下的index.js,里面有个build的内容，把其中的productionSourceMap改成false

三、凡是修改了项目的配置，都要重新npm run dev 哟，因为热重载一般是自动更新修改的页面

四、vue的Post请求到后台语言（php，java，asp啥的），发现post不出去，不报错又没效果
解决方案：加上{emulateJSON: true}。例如：

    this.$http.post("url", {
        //参数
    },{emulateJSON: true}).then(function(res) {
        //suc
    });

五、发现webpack打包后，页面是空的
可能你的路由mode是history，要改成hash，一般默认是hash。

。。。就大概说这些吧，想不起来了。。。我只是个初学者。。。

最后link一下算是带我入门的导师，慕课网的河畔一角，看了他的视频，讲的很棒
https://coding.imooc.com/clas...

还有我的项目，大家喜欢的话，可以找我要源码，同时跪求！跪求！有大神可以指点我一下子！
http://111.230.91.125:3000/#/
http://111.230.91.125:8080/Vshop/view/index.html

如果你觉得文章不错的话，点个小赞呗，谢谢谢谢，嘻嘻嘻！

猜你喜欢