VUE遇到的一些用法

最新推荐文章于 2024-09-17 14:30:35 发布

太阳男神luck

最新推荐文章于 2024-09-17 14:30:35 发布

阅读量83

点赞数

分类专栏：基础语法文章标签： ajax

本文链接：https://blog.csdn.net/weixin_42601992/article/details/119671765

版权

基础语法专栏收录该内容

6 篇文章 1 订阅

订阅专栏

文章目录

1.什么是axios

axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端。简单的理解就是ajax的封装

它本身具有以下特征：
a.从浏览器中创建 XMLHttpRequest
b.从 node.js 发出 http 请求
c.支持 Promise API
e.拦截请求和响应
f.转换请求和响应数据
g.取消请求
h.自动转换JSON数据

2.vue中get与post请求

vue高版本中，推荐使用axios进行网络请求，而不再使用vue-resource。
在vue04项目中，在终端运行 npm install --save axios vue-axios ，下载vue-axios插件
注意：“vue04项目”是指我的上篇博客中通过vue-cli脚手架创建的项目（后面我会附上源码，博客标题：《利用vue-cli创建项目步骤简述》，博客链接：https://blog.csdn.net/qq_41115965/article/details/80766520）

提示：使用插件的时候，一般都要在入口文件main.js中引入，因为main.js项目运行首先运行的文件。具体代码如下：

3.vue路由里面的 router.push(),router.replace(),router.go()

一、router.push()

    想要导航到不同的 URL，则使用 router.push 方法。这个方法会向 history 栈添加一个新的记录，所以，当用户点击浏览器后退按钮时，则回到之前的 URL

声明式：

编程式：router.push(…)

二、router.replace()

    跟 router.push 很像，唯一的不同就是，它不会向 history 添加新记录，而是跟它的方法名一样 —— 替换掉当前的 history 记录

声明式：

编程式：router.replace(…)

三、router.go()

    这个方法的参数是一个整数，意思是在 history 记录中向前或者后退多少步，类似window.history.go(n)

4.@ResponseBody

作用：@ResponseBody注解用于将Controller的方法返回的对象，通过springmvc提供的HttpMessageConverter接口转换为指定格式的数据如：json,xml等，通过Response响应给客户端。

5.@RequestBody

作用：@RequestBody注解用于读取http请求的内容(字符串)，通过springmvc提供的HttpMessageConverter接口将读到的内容（json数据）转换为java对象并绑定到Controller方法的参数上。

6.import

引入js文件
在用的那一页，引入文件
Import tools from ‘./tools.js’
相应的js文件，必须暴露出来

7.VUE引入组件

引入组件 Import Hello from ‘./components/hello’

8.VUE引入外部组件

npm install --save axios
npm install mint-ui -S
npm i element-ui -S

9.VUE引入全部组件

import Vue from ‘vue’
import Mint from ‘mint-ui’
Vue.use(Mint)

10.VUE按需引入部分数组

//按需引入部分组件

Import {Cell,Checklist} from ‘minu-ui’
Vue.component(Cell.name,Cell)
Vue.component(Checklist.name,Checklist)

11.VUE的require的用法

require.js的加载
require的使用非常简单，它相当于module.exports的传送门，module.exports后面的内容是什么，require的结果就是什么，对象、数字、字符串、函数……再把require的结果赋值给某个变量，相当于把require和module.exports进行平行空间的位置重叠

引入：

require(’./a’)(); // a模块是一个函数，立即执行a模块函数

var data = require(’./a’).data; // a模块导出的是一个对象

var a = require(’./a’)[0]; // a模块导出的是一个数组

从理解上，require是赋值过程，import是解构过程，当然，require也可以将结果解构赋值给一组变量，但是import在遇到default时，和require则完全不同：
var $ = require(‘jquery’);
import $ from ‘jquery’
是完全不同的两种概念。