Web前端开发网

fly63.com

首页 资源 工具 文章 教程 栏目
  • 关于我们
  • 网站投稿
  • 赞助一下
搜索

在线工具_工作生活好帮手

打造各种简单、易用、便捷的在线工具,网友无需注册和下载安装即可使用

点击查看

资源分类

AI智能 酷站推荐 招聘/兼职 框架/库 模块/管理 移动端UI框架 Web-UI框架 Js插件 Jquery插件 CSS相关 IDE环境 在线工具 图形动效 游戏框架 node相关 调试/测试 在线学习 社区/论坛 博客/团队 前端素材 图标/图库 建站资源 设计/灵感 IT资讯
提交资源 / 链接反馈

Alova

分享
复制链接
新浪微博
QQ 好友

扫一扫分享

网站地址:https://alova.js.org/
GitHub:https://github.com/alovajs/alova
网站描述:Vue.js、React.js 和 Svelte.js 等 MVVM 库的请求策略库
访问官网 GitHub

Alova轻量级的请求策略库,它针对不同请求场景分别提供了具有针对性的请求策略,来提升应用可用性、流畅性,降低服务端压力,让应用如智者一般具备卓越的策略思维。


特点

  • 交互式文档和演示
  • 支持 vue、react、svelte
  • 实时自动状态管理
  • 类似 axios 的 api 设计,更简单
  • 4kb,只有 axios 的 30%+
  • 声明式场景请求
  • 灵活:使用任何请求库,如 axios、superagent 或 fetch-api
  • 3种响应数据缓存模式
  • 界面数据在任何情况下都是预取的,这意味着用户可以更快地看到信息
  • 服务端渲染(SSR)
  • Typescript 支持
  • 静默/离线提交
  • 完全支持 Tree shaking:只拿你想要的,捆绑大小
  • 丰富的扩展功能,可以自定义请求适配器、存储适配器、请求中间件、状态钩子等


和请求库的关系是什么?

alova 的创建初衷是对不同请求场景提出的一个解决方案,它可以更简洁优雅地实现体验更好,性能更好的请求功能,是一个 RSM 实现库,而例如$.ajax、axios 和 fetch-api 等对请求发送和响应接收提供了很好的支持,它们是 RSM 流程中必不可少的一个环节(请求事件环节),alova 仍然需要依靠它们进行请求,因此我们可以将 alova 看作是请求库的一种武装,让请求库变得更加强大。


什么是请求场景模型

请求场景模型是以客户端视角的,描述客户端从触发请求意图到接收请求结果的抽象模型,分别由请求时机、请求行为、请求事件以及响应管理四个阶段组成。例如在进行一次请求时经常需要思考以下问题,

  1. 什么时候发出请求;
  2. 是否要展示请求状态;
  3. 是否需要对请求进行失败重试;
  4. 要如何加工响应数据;
  5. 是否需要对请求参数加密;
  6. 是否要对高频使用的响应数据做缓存;
  7. 如何进行跨页面操作数据;
  8. 弱网或断网环境下需要如何处理请求;
  9. ...

fetch或axios往往更专注于如何与服务端交互,但对于上面的问题我们总是需要自己处理,这些有利于应用性能和稳定性的功能,总会让程序员们编写出低维护性的代码。请求场景模型就是从准备请求到响应数据加工完毕的所有环节进行抽象,从而覆盖以前端为视角的,整个 CS 交互生命周期的模型。alova就是一个以请求场景模型的库,它是对axios等请求库的一种补充,而非替代品。


安装

# 使用 npm
npm install alova --save

# 使用 yarn
yarn add alova


示例

import { createAlova } from 'alova';
import VueHook from 'alova/vue';
import { createAlovaMockAdapter, defineMock } from '@alova/mock';

// mock data
const mockData = defineMock({
'/get-list': ['apple', 'banana', 'orange'],
});

// create a alova instance
const alovaInst = createAlova({
baseURL: 'http://example.com',
statesHook: VueHook,
requestAdapter: createAlovaMockAdapter([mockData], { delay: 1500 }),
responsed: (response) => response.json(),
});

export const getData = () => alovaInst.Get('/get-list');


仅供个人学习参考/导航指引使用,具体请以第三方网站说明为准,本站不提供任何专业建议。如果地址失效或描述有误,请联系站长反馈~感谢您的理解与支持!

链接: https://fly63.com/nav/3944

more>>
相关栏目
Express
基于 Node.js 平台,快速、开放、极简的 web 开发框架
官网 GitHub
pm2
pm2 是一个带有负载均衡功能的Node应用的进程管理器
官网 GitHub
Koa
基于 Node.js 平台的下一代 web 开发框架
官网 GitHub
Egg.js
为企业级框架和应用而生
官网 GitHub
Primus
通用包装器实时框架
点击进入 GitHub
Electrode
一个用于构建通用 React / Node.js 应用程序的平台
点击进入 GitHub
faye-websocket
Node.js 应用程序中命令预先存在的 WebSocket 连接
点击进入 GitHub
vm2
一个Node.js 官方 vm 库的替代品
点击进入 GitHub
node-opencv
node视觉算法库
官网 GitHub
node-xml2js
Json与xml相互转化的工具
点击进入 GitHub
node-red
一套开源可视化界面开发工具
官网 GitHub
polemo
网易开源的游戏后端框架
点击进入 GitHub
AdonisJs
一款类似laravel的node.js框架
官网 GitHub
GitBook
基于 Node.js 的命令行工具,可使用 Github/Git 和 Markdown 来制作精美的电子书。
官网
nodebestpractices
NodeJS最佳实践
官网 GitHub
Inquirer.js
NodeJs交互式命令行工具
点击进入 GitHub
首页 技术导航 在线工具 技术文章 教程资源 AI工具集 前端库/框架 实用工具箱

Copyright © 2018 Web前端开发网提供免费在线工具、编程学习资源(教程/框架/库),内容以学习参考为主,助您解决各类实际问题,快速提升专业能力。

手机预览