![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
徐扬_前端小白的成长之路
这个作者很懒,什么都没留下…
展开
-
vue-反向代理配置
vue-反向代理配置通过axios请求接口mounted() { axios.get("https://m.maoyan.com/ajax/movieOnInfoList?token=").then(res => { console.log(res.data); })},出现跨域如果你的前端应用和后端 API 服务器没有运行在同一个主机上,你需要在开发环境下将 API 请求代理到 API 服务器。这个问题可以通过 vue.config.js 中的 devServer.pr原创 2020-07-27 16:02:02 · 861 阅读 · 1 评论 -
Vue入门(13)webpack下
1.解析es6下载npm i babel-core babel-loader babel-preset-env babel plugin-transform-runtime -S配置//处理es6,7,8{ test: /\.js$/, loader : 'babel-loader', exclude:/node_modules/,//排除掉node_m...原创 2019-05-07 17:17:49 · 102 阅读 · 0 评论 -
Vue入门(9)路由2
demo路由权限控制需求:有首页和博客两个按钮,点击首页可以查看首页内容,点击博客的时候需要判断登录状态。如果未登录的话则需要跳转到登录页面。<div id="app"> <router-link to="/home">首页</router-link> <route原创 2019-02-27 11:55:57 · 150 阅读 · 0 评论 -
Vue入门(12)webpack上
1.安装npm i webpack@3.12.0 -D2.编译打包生成build.js看下目录结构首先新建一个main.js.main.js是整个程序的入口文件。main.js中import Vue from "./vue.js"import App from './App.js'import { num1, num2, add} from "./App&q原创 2019-03-08 15:28:21 · 256 阅读 · 1 评论 -
Vue入门(8)路由
1.原生js模拟路由实现原理<a href="#/login">登录</a><a href="#/register&qu原创 2019-02-26 15:35:22 · 197 阅读 · 0 评论 -
Vue入门(7)ref和$nextTick()
1.利用ref获取dom对象1.给标签绑定ref="xxx"属性,可以用this.$refs.xxx获取到原生dom对象2.如果给组件绑定ref="xxx"属性,this.$refs.xxx获取到的是当前的组件对象3.ref属性值不能重名,否则后面会覆盖前面的<div id="app"></div> <script> var App = { ..原创 2019-02-26 13:16:46 · 836 阅读 · 0 评论 -
Vue入门(6)生命周期
<div id="app"> <App></App></div><script> Vue.component("Tset",{ data(){ return { msg : "hello"原创 2019-02-25 17:32:05 · 166 阅读 · 0 评论 -
Vue入门(5)侦听及计算属性
1.侦听器Vue 通过 watch 选项提供了一个更通用的方法,来响应数据的变化。当需要在数据变化时执行异步或开销较大的操作时,这个方式是最有用的。watch监听的是单个属性基本数据类型:简单监听<div id="app"> <input type="text" v-model="msg" /> <h2>{{msg}}</h2&a原创 2019-02-25 15:08:48 · 144 阅读 · 0 评论 -
Vue入门(4)过滤器
1.过滤器的作用过滤器的作用:实现数据的筛选、过滤、格式化。2.过滤器的使用语法: <any>{{表达式 | 过滤器}}</any>举个例子: <h1>{{price | myCurrency}}</h1>3.过滤器的高级用法在使用过滤器的时候,还可以指定参数,来告诉过滤器按照参数进行数据的过滤。①如何给过滤器传参?<...原创 2019-02-25 13:41:00 · 119 阅读 · 0 评论 -
Vue入门(3)插槽
1.插槽插槽,内置组件slot,作为承载分发内容的出口先看一下下面的代码:声明一个child-component组件,如果现在我想在<child-component></child-component>内放置一些内容,结果会是怎样?<div id="app"> <child-component></child-compone...原创 2019-02-25 11:44:37 · 298 阅读 · 0 评论 -
Vue入门(2)组件
组件组件是可复用的 Vue 实例,且带有一个名字。 组件是Vue.js最强大的功能之一。组件可以扩展HTML元素,封装可重用的代码。在较高层面上,组件是自定义的元素,Vue.js的编译器为它添加特殊功能。在有些情况下,组件也可以是原生HTML元素的形式,以is特性扩展。1.局部组件的创建&lt;div id="app"&gt; &lt;Child&gt;&lt;/Child&原创 2019-02-25 10:10:18 · 218 阅读 · 0 评论 -
Vue入门(11)axios请求拦截器实现数据加载出来之前loading效果
axios请求拦截器实现数据加载出来之前loading效果实现思路:用CSS3写出一个loading动画,默认隐藏。在请求拦截器里让动画显示出来,再在响应拦截器里隐藏动画。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name=&原创 2019-02-27 16:23:37 · 5630 阅读 · 0 评论 -
Vue入门(10)axios
1.安装npm install axios2.使用执行 GET 请求// 为给定 ID 的 user 创建请求axios.get('/user?ID=12345') .then(function (response) { console.log(response); }) .catch(function (error) { console.log(erro...原创 2019-02-27 15:04:42 · 170 阅读 · 0 评论 -
Vue入门(1)指令
安装$ npm install vue安装完目录文件介绍然后新建一个页面,引入vue.js, 创建vue对象&lt;div id="app"&gt;&lt;/div&gt;&lt;script src="node_modules/vue/dist/vue.js"&gt;&lt;/script&gt原创 2018-12-18 14:26:33 · 295 阅读 · 0 评论