Vue
One-Direction
这个作者很懒,什么都没留下…
展开
-
render: h => h(App)
render: h => h(App) 是下面内容的缩写:render: function (createElement) { return createElement(App);}进一步缩写为(ES6 语法):render (createElement) { return createElement(App);}再进一步缩写为:render (h){ ...原创 2019-08-08 10:18:16 · 303 阅读 · 0 评论 -
axios请求拦截以及响应拦截
作为一个出色的http请求库,axios提供了强大请求拦截和响应拦截功能。请求拦截//引入vueximport store from '@/store'...axios.interceptors.request.use(config => { //将token添加到了request的header里面 const token = store.state.token; ...转载 2019-08-07 17:06:02 · 873 阅读 · 0 评论 -
Vue.config.productionTip=false
对于开发版本,会默认向控制台打印:设置为false就不会提示了Vue.config.productionTip = false;转载 2019-08-07 13:54:43 · 1150 阅读 · 0 评论 -
Vue传值--三种常用传值
父组件传值给子组件,首先父组件发送的形式是用bind(用缩写:)绑定值到子组件身上。然后子组件用属性props接收。子组件传值父组件,首先是子组件发送的形式是this.$emit(事件名,需要发送的值),事件名:父组件on监听的方法,父组件第一件事就是监听子组件发送过来的事件名,@事件名=获取值的方法。获取值的方法(值)*,就这样拿到了儿子发过来的值兄弟传值,两个都要引入公共js->b...转载 2019-08-09 11:56:14 · 740 阅读 · 0 评论 -
Vue中的v-for循环key属性注意事项小结
当Vue用 v-for 正在更新已渲染过的元素列表时,它默认用“就地复用”策略。如果数据项的顺序被改变,Vue将不是移动DOM元素来匹配数据项的改变,而是简单复用此处每个元素,并且确保它在特定索引下显示已被渲染过的每个元素。为了给Vue一个提示,以便它能跟踪每个节点的身份,从而重用和重新排序现有元素,你需要为每项提供一个唯一 key 属性。key属性的类型只能为 string或者numbe...转载 2019-08-09 11:16:48 · 999 阅读 · 0 评论 -
provide/inject
概述provide/inject:简单的来说就是在父组件中通过provide来提供变量,然后在子组件中通过inject来注入变量。需要注意的是这里不论子组件有多深,只要调用了inject那么就可以注入provide中的数据。而不是局限于只能从当前父组件的prop属性来获取数据。写法// 传入对象写法provide: { foo: 'bar'}// 函数写法provide (...原创 2019-08-09 10:30:30 · 1215 阅读 · 0 评论 -
使用axios进行跨域访问数据库接口实现前后端分离
安装axiosnpm install axios --save如果安装有cnpm可以使用cnpm使用淘宝镜像安装,速度更快;–save是向dependencies节点写入依赖,下次安装会把module包安装到node_modules目录汇总,会修改package.json,将模块名和版本号添加到dependencies部分,之后运行npm install 命令时,会自动安装module包。...原创 2019-04-13 08:54:26 · 2990 阅读 · 0 评论 -
Vue进行前端开发环境安装并且导入Jquery和Bootstrap
IDE下载直接下载webstorm或者下载jetbrains toolbox通过注册的jetbrains的学生账号登录可以在里面选择你要下载的ide(注册网址: https://www.jetbrains.com/student/,需要登录学校邮箱验证,时间需要几分钟,请耐心等)搭建vue环境下载对应的node.js版本,具体操作流程: vue 搭建成功后如图westorm搭建vu...原创 2019-04-13 09:23:57 · 920 阅读 · 0 评论 -
Vue核心技术
模板语法Vue的文件结构template模板+script+style插值语法{{msg}}:msg在data定义,可以是字符串,数据,js表达式指令(指令缩写):v-on:click⟹\Longrightarrow⟹@click,v-bind:href⟹\Longrightarrow⟹:href计算属性和监听属性computed(异步场景)watch(数据联动)...原创 2019-07-22 12:10:28 · 262 阅读 · 0 评论 -
vue父子组件通信实例
组件是 vue.js 最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用。那么组件间如何通信,也就成为了vue中重点知识了。这篇文章将会通过props、$ref和 $emit 这几个知识点,来讲解如何实现父子组件间通信。在说如何实现通信之前,我们先来建两个组件father.vue和child.vue作为示例的基础。 //父组件 <te...转载 2019-05-10 12:43:05 · 182 阅读 · 0 评论 -
vue+axios 前端实现登录拦截(路由拦截、http拦截)
大致流程:在进行路由跳转时,利用vue-router提供的钩子函数beforeEach()对路由进行判断,符合条件next(),不符合便跳转到登录页面。在发送请求时,统一处理所有http请求和响应,用上 axios 的拦截器,通过配置http resquest interceptors为http头增加Authorization字段,其内容为Token,通过配置http response inte...转载 2019-08-08 15:19:09 · 960 阅读 · 0 评论 -
Vue的$
除了用户自定义的属性与方法,Vue 还保留了一些有用的实例属性与方法。它们都有前缀$,以便与用户定义的属性区分开来”虽然属性名上添加前缀不是必须的,但是这样做可以提醒糊涂的开发人员(可能是你),这是一个公共API属性或方法,欢迎你使用,不像其他属性的实例,可能只是为了 Vue 的内部使用。作为基于原型的语言,Javascript 中没有(真正的)类,因此也没有 “私有” 和 “公共” 变量或...原创 2019-08-08 14:19:09 · 259 阅读 · 0 评论 -
Vue生命周期函数
前言说到Vue的钩子函数,可能很多人只停留在一些很简单常用的钩子(created,mounted),而且对于里面的区别,什么时候该用什么钩子,并没有仔细的去研究过,且Vue的生命周期在面试中也算是比较高频的考点,那么该如何回答这类问题,让人有眼前一亮的感觉呢…Vue-Router导航守卫:有的时候,我们需要通过路由来进行一些操作,比如最常见的登录权限验证,当用户满足条件时,才让其进入导航,否...转载 2019-08-12 14:50:22 · 349 阅读 · 0 评论