Vue2学习笔记
文章平均质量分 58
学习交流
A_bad_boy_hahaha
猜猜我是谁,哈哈哈
展开
-
vue项目整合jest单元测试
【代码】vue项目整合jest单元测试。原创 2022-10-20 17:27:36 · 654 阅读 · 1 评论 -
在VUE2中使用axios
axios食用指南1、安装axios2、常见的请求方式get请求post请求执行并发请求(all)自定义axios实例请求配置项响应结构axios请求和响应拦截器资源参考:[菜鸟教程axios](https://www.runoob.com/vue2/vuejs-ajax-axios.html)1、安装axiosnpm install axios2、常见的请求方式get请求axios .get('url地址') .then(res => (console.log(res)))原创 2021-04-06 14:15:26 · 679 阅读 · 0 评论 -
在VUE项目中使用axios配置proxy
/* 首先安装并引入axios 1、npm install axios -S 2、import axios from "axios"; 3、vue.config.js文件中配置proxy devServer: { proxy: { '/api': { target: 'http://rap2api.taobao.org', changeOrigin: true, // 跨域 pathRewrite:原创 2021-03-26 14:41:13 · 371 阅读 · 0 评论 -
Vue(六)插件&过滤器
Vue(六)插件&过滤器插件的使用Vue有非常强大的插件,这也是它的强大之处。首先你应该导入插件import Vue from "vue";import VueRouter from "vue-router";然后使用插件Vue.use(VueRouter);过滤器有时候你拿到的数据需要处理之后才能插入到页面中,这个时候你就需要用到过滤器。过滤器可以用在两个地方:插值语法和**v-bind表达式**中。<!-- 在双花括号中 -->{{ message | c原创 2021-01-23 15:16:31 · 108 阅读 · 0 评论 -
Vue(三) 组件基础
Vue(三):组件基础demo定义一个Vue组件(组件中只能包含一个根元素)// 定义一个名为 button-counter 的新组件Vue.component('button-counter', { data: function () { return { count: 0 } }, template: '<button v-on:click="count++">You clicked me {{ count }} times.</but原创 2021-01-23 14:58:30 · 75 阅读 · 0 评论 -
Vue(三)深入了解组件
Vue(三)深入了解组件组件注册全局注册我们之前用Vue.component来创建组件:Vue.component('my-component-name', { // ... 选项 ...})这些组件是全局注册的,就是说注册之后,在任何新创建的Vue实例的模板中都可以使用。例如:Vue.component('component-a', { /* ... */ })Vue.component('component-b', { /* ... */ })Vue.component('c原创 2021-01-23 14:57:55 · 90 阅读 · 0 评论 -
Vue(四)组件之间的通信
Vue(四)组件之间的通信父子组件通信父组件通过v-bind绑定自定义属性,将数据传递给子组件。子组件需要写props选项来接收父组件传递的参数,然后在子组件中使用。<div id="app"> <p>{{msg}}</p> <global></global> </div> <template id="father"> <div> <p>这是fa原创 2021-01-23 14:57:22 · 66 阅读 · 0 评论 -
Vue(五)自定义指令
Vue(五)自定义指令全局自定义指令和局部自定义指令。Vue允许用户自定义指令,来对DOM元素进行底层操作。自定义指令分为:全局自定义指令和局部自定义指令。注册一个全局自定义指令 focus:获取焦点 Vue.directive("focus",{ //当被绑定的元素()插入到父节点的时候,就会触发inserted inserted(el){ el.focus() } })let vm = new Vue({原创 2021-01-22 09:59:20 · 79 阅读 · 0 评论 -
Vue笔记---Vue指令
Vue笔记—Vue指令1、v-text指令使用效果和插值语法的效果一样<span v-text="msg"></span><!-- 和下面的一样 --><span>{{msg}}</span>2、v-html指令在vue的插值语法中是不支持输出html代码的,因为在网站上渲染出来html代码是非常危险的,会遭遇XSS攻击。所以可以使用v-html指令来输出你想要打印的内容。<div v-html="html">&l原创 2021-01-22 09:53:54 · 154 阅读 · 0 评论 -
Vue的生命周期
Vue的生命周期组件从创建到销毁的一系列过程叫做组件的生命周期Vue在整个声明周期里提供了一些钩子函数,可以在内部实现一些业务逻辑,并且这些函数也会在一些特定的场合下去执行。![](https://img-blog.csdnimg.cn/img_convert/e7b606ff38f6bcae4903ce34d6261905.png#align=left&display=inline&height=1509&margin=[object Object]&originHei原创 2021-01-22 09:53:27 · 78 阅读 · 0 评论 -
Vue基础(二)
Vue基础(二)条件渲染v-ifv-if指令用于条件性地渲染一块内容。这块内容只有在指令地表达式为真的时候会被渲染,后面也可以加v-else-if或v-else注意:v-if和v-for不要使用在一个元素上<h1 v-if="awesome">Vue is awesome!</h1><h1 v-else>Oh no ????</h1>由于指令必须添加到一个元素上,但是如果想要切换多个元素呢?此时可以把一个<template>元素当原创 2021-01-22 09:50:10 · 123 阅读 · 0 评论 -
Vue基础(一)
Vue基础(一)1、Vue.js是什么?Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。具有易用、灵活、高效的特点。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。vue的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进DOM<div id="app"&原创 2021-01-22 09:49:33 · 87 阅读 · 0 评论