1.用vue创建项目的时候,

  1.安装axios,对axios进行处理,创建axios.js文件,设置基础请求地址,

    设置前置守卫和独享守卫,对请求数据进行设置,(特别实在进行token验证的时候特别需要设置)

  2.后台服务器如果跨域,需要在根目录创建vue.config.js具体参考vue官网的介绍

  3.配置router,对router进行修改,创建一个router文件夹,把router.js改为index.js放进区,

    在index.js中设置 ,把routes进行独立出来,可以进行单独的设置,没款花更加细致

  3.对vuex的stor进行设置设置进行模块的操作,对modules进行单独的设置,然后引入store中即可

  4.安装element(vue add element)

  5.删除不需要的模块,对router,main。js进行删除和修改

2.使用时,

  1.app.vue中进行view的实现,以达到更好的使用效果,

  2.对modules的模块进行namespaced:true设置,这样可以很好的处理一些简单是模块方法的命名问题

  3.在创建组件的时候,如果是动态组件就创建在views中,如果是固定的组件,就创建到components中,对组件的使用要充分认识到他的作用

  4.合理使用slot插槽的使用,插槽分为不命名插槽和命名插槽,当需要在传输法诺个值的时候就需要命名插槽

  5.动态绑定数据,对数的使用要进行分析

  6.组件中的数据不一定要逗存储在state中,要根据存储的数据 作用范围和来源,和是否被其他组件使用,合理使用组件自身的data属性

  7.组件想vuex请求数据时,一定要如果是state数据就可以直接使用,(this.$store.menu.state.user)

   actions和getters中,要添加模块名称(this.$store.dispatch('menu/getuser',id))

  8.在第一次进入页面的时候就要请求数据,这时使用的是state的数据,但是在页面徐盎然之前,要在钩子函数created中进行请求数据对state中数据进行赋值,一次达到页面请求数据时有数据的效果

3.element插件

  1.element插件在使用的时候一定要看api文档

  2.在是用的时候对数据和请求的使用一定要合理

总结一下《vue的使用》的更多相关文章

  1. Vue.js 和 MVVM 小细节

    MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自 ...

  2. wepack+sass+vue 入门教程(三)

    十一.安装sass文件转换为css需要的相关依赖包 npm install --save-dev sass-loader style-loader css-loader loader的作用是辅助web ...

  3. wepack+sass+vue 入门教程(二)

    六.新建webpack配置文件 webpack.config.js 文件整体框架内容如下,后续会详细说明每个配置项的配置 webpack.config.js直接放在项目demo目录下 module.e ...

  4. wepack+sass+vue 入门教程(一)

    一.安装node.js node.js是基础,必须先安装.而且最新版的node.js,已经集成了npm. 下载地址 node安装,一路按默认即可. 二.全局安装webpack npm install ...

  5. Vue + Webpack + Vue-loader 系列教程(2)相关配置篇

    原文地址:https://lvyongbo.gitbooks.io/vue-loader/content/ 使用预处理器 在 Webpack 中,所有的预处理器需要和一个相应的加载器一同使用.vue- ...

  6. Vue + Webpack + Vue-loader 系列教程(1)功能介绍篇

    原文地址:https://lvyongbo.gitbooks.io/vue-loader/content/ Vue-loader 是什么? vue-loader 是一个加载器,能把如下格式的 Vue ...

  7. 关于Vue.js 2.0 的 Vuex 2.0,你需要更新的知识库

    应用结构 实际上,Vuex 在怎么组织你的代码结构上面没有任何限制,相反,它强制规定了一系列高级的原则: 应用级的状态集中放在 store 中. 改变状态的唯一方式是提交mutations,这是个同步 ...

  8. Vue.js 2.0 和 React、Augular等其他框架的全方位对比

    引言 这个页面无疑是最难编写的,但也是非常重要的.或许你遇到了一些问题并且先前用其他的框架解决了.来这里的目的是看看Vue是否有更好的解决方案.那么你就来对了. 客观来说,作为核心团队成员,显然我们会 ...

  9. 窥探Vue.js 2.0 - Virtual DOM到底是个什么鬼?

    引言 你可能听说在Vue.js 2.0已经发布,并且在其中新添加如了一些新功能.其中一个功能就是"Virtual DOM". Virtual DOM是什么 在之前,React和Em ...

  10. 初探Vue

    Vue.js(读音/vju:/,类似于view),是近来比较火的前端框架,但一直没有怎么具体了解.实现过,就知道个啥的MVVM啦,数据驱动啦,等这些关于Vue的虚概念. 由于最近,小生在公司中,负责开 ...

随机推荐

  1. 用Python监听鼠标和键盘事件

    PyHook是一个基于Python的“钩子”库,主要用于监听当前电脑上鼠标和键盘的事件.这个库依赖于另一个Python库PyWin32,如同名字所显示的,PyWin32只能运行在Windows平台,所 ...

  2. go语言net包udp socket的使用

    udp与tcp的不同在于客户端请求方式不同,udp缺少Accept函数. 一个简单的udp客户端: package main; import ( "net" "log&q ...

  3. php使用fputcsv进行大数据的导出

    为了实验大数据的导出,我们这里先自已创建一张大表,表结构如下: CREATE TABLE `tb_users` ( `id` int(11) unsigned NOT NULL AUTO_INCREM ...

  4. json等序列化模块 异常处理

    今日学习内容如下: 1.序列化模块 什么叫序列化——将原本的字典.列表等内容转换成一个字符串的过程就叫做序列化. 比如,我们在python代码中计算的一个数据需要给另外一段程序使用,那我们怎么给? 现 ...

  5. hdu 2444(二分图) The Accomodation of Students

    http://acm.hdu.edu.cn/showproblem.php?pid=2444 大意是给定n个学生,他们之间可能互相认识,首先判断能不能将这些学生分为两组,使组内学生不认识: 现想将学生 ...

  6. IDEA 的 Edit 设置

    1.设置鼠标悬浮提示 General -- Show quick documentation on mouse move 2.自动导包 3.设置显示行号和方法的间隔符 4.忽略大小写  4.设置取消单 ...

  7. SSH原理与运用(一):远程登录(转)

      作者: 阮一峰 日期: 2011年12月21日 SSH是每一台Linux电脑的标准配置. 随着Linux设备从电脑逐渐扩展到手机.外设和家用电器,SSH的使用范围也越来越广.不仅程序员离不开它,很 ...

  8. iOS通过URL构建UIImage

    很多时候我们只能得到一个URL,然后需要构建一个UIImage. 通常情况下,我们一般都是通过SDWebImage来直接构建UIImageVIew的image,如何用URL直接构建UIImage呢? ...

  9. php 类与对象

    1.类与对象 对象:实际存在该类事物中每个实物的个体.$a =new User(); 实例化后的$a引用:PHP的别名,两个不同的变量名字指向相同的内容 封装: 把对象的属性和方法组织在一个类(逻辑单 ...

  10. Luogu 1764 翻转游戏 - 枚举 + 搜索

    题目描述 kkke在一个n*n的棋盘上进行一个翻转游戏.棋盘的每个格子上都放有一个棋子,每个棋子有2个面,一面是黑色的,另一面是白色的.初始的时候,棋盘上的棋子有的黑色向上,有的白色向上.现在kkke ...