什么是 raya
raya 是一个轻量级的前端 UI 组件库，通过 npm 安装和引入，支持使用 vue 和 react 两种前端框架。raya 提供了丰富的 UI 组件，能够快速提升前端开发效率。
安装和引入
安装
如果你使用 npm 作为包管理工具，可以通过以下命令进行安装:
npm install raya --save
引入
vue
在项目的 main.js 文件中引入，并且在 Vue 实例中做全局注册：
import Vue from 'vue' import Raya from 'raya' Vue.use(Raya)
在组件中使用：
-- -------------------- ---- ------- ---------- ----- ------------ -------------------------------------------- ------ ----------- -------- ------ ------- - -------- - ------------- - --------------------- - - - ---------展开代码
react
在项目中引入，通过 ES6 import 语法进行引入：
-- -------------------- ---- ------- ------ ----- ---- ------- ------ - ---------- - ---- ------------ ----- --- ------- --------------- - --- -------- - ------ - ----- ----------- ------------------------------------------ ------ - - -展开代码
组件列表
raya 提供了众多常用的 UI 组件，下面列出一部分常用组件的使用方法：
Button 按钮
vue
<raya-button>按钮</raya-button>
react
<RayaButton>按钮</RayaButton>
Icon 图标
vue
<raya-icon type="search" />
react
<RayaIcon type='search' />
Input 输入框
vue
<raya-input v-model="inputValue" />
react
<RayaInput value={inputValue} onChange={handleChange} />
Cascader 级联选择器
vue
<raya-cascader :options="options" v-model="value" />
react
<RayaCascader options={options} value={value} onChange={handleChange} />
源码和文档
raya 的官方文档和源码可通过以下链接进行访问：
官方文档：https://raya-ui.github.io/raya-docs/
源码地址：https://github.com/raya-ui
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005663e81e8991b448e2446
