当前位置:网站首页>uniapp uview组件库的使用方法(下载方式)
uniapp uview组件库的使用方法(下载方式)
2022-07-28 05:19:00 【乐檬青年】
uview组件库官网地址:uView 1.0 - 多平台快速开发的UI框架 - uni-app UI框架
uView 2.0 - 全面兼容nvue的uni-app生态框架 - uni-app UI框架
版本对比:对比1.X | uView 2.0 - 全面兼容nvue的uni-app生态框架 - uni-app UI框架
注意:uView依赖SCSS,您必须要安装此插件,否则无法正常运行。在HX菜单的 工具->插件安装中找到"scss/sass编译"插件进行安装, 如不生效,重启HX即可
第一步: 下载
在uni-app插件市场右上角选择使用HBuilder X 导入插件或者下载插件ZIP,将下载后的uview-ui文件夹,复制到项目根目录。
下载地址:uView - DCloud 插件市场
https://ext.dcloud.net.cn/plugin?id=6682
第二步: 配置
2.1. 引入uView主JS库
在项目根目录中的main.js中,引入并使用uView的JS库,注意这两行要放在import Vue之后。
// main.js
import uView from "uview-ui";
Vue.use(uView);2.2.再引入uView的全局SCSS主题文件
在项目根目录的uni.scss中引入此文件。
/* uni.scss */
@import 'uview-ui/theme.scss';2.3.引入uView基础样式
注意!在App.vue中首行的位置引入,注意给style标签加入lang="scss"属性
<style lang="scss">
@import "uview-ui/index.scss";
</style>2.4.配置easycom组件模式
在根目录pages.json中进行这一步
有关easycom模式的介绍,请移步参考:点击easycom模式使vue组件无需引入即可使用_wflynn的博客-CSDN博客_easycomeasycomHBuilderX 2.5.5起支持easycom组件模式。传统vue组件,需要安装、引用、注册,三个步骤后才能使用组件。easycom将其精简为一步。 只要组件安装在项目的components目录下,并符合components/组件名称/组件名称.vue目录结构。就可以不用引用、注册,直接在页面中使用。 如下:<template> <vi...https://blog.csdn.net/weixin_40013817/article/details/105612630
"easycom": {
"autoscan": true,
"custom": {
"^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
}
}第三步: 开始使用
至此,已完成uview的所有安装和配置,接下来就可以开始使用了
示例:
<template>
<u-input v-model="value" :type="type" :border="border" />
</template>
<script>
export default {
data() {
return {
value: '',
type: 'text',
border: true
}
}
}
</script>边栏推荐
- C语言回顾(修饰词篇)
- Arrangement of main drawings of the latest 54 papers of eccv22
- Custom JSON return data
- Pytorch uses maxpool to realize image expansion and corrosion
- How Visio accurately controls the size, position and angle of graphics
- Openjudge: patient queuing
- 分支与循环语句
- 基于Easy CHM和VS的帮助文档制作
- Arcgis Engine安装的若干问题
- ES6--->箭头函数、类、模块化
猜你喜欢
随机推荐
Arrangement of main drawings of the latest 54 papers of eccv22
Shell operation principle
结果填空 国庆有几天是星期日(纯Excel解决)
JS数组的方法大全
You must configure either the server or JDBC driver (via the ‘serverTimezone)
DOM--事件链、事件冒泡和捕获、事件代理
Canvas绘图2
c语言:通过一个例子来认识函数栈帧的创建和销毁讲解
标准C语言学习总结5
函数基础知识以及特殊点
Arcgis Engine安装的若干问题
树莓派串口
Microsoft Edge浏览器插件(2)
链表实现增删查改
冶金物理化学复习 -- 金属电沉积过程中的阴极极化,超电势以及阳极和阳极过程
Review of metallurgical physical chemistry --- liquid liquid reaction kinetics
树莓派蓝牙调试过程
博学谷学习记录】超强总结,用心分享 | 常用api
Using Navicat or PLSQL to export CSV format, more than 15 digits will become 000 (e+19) later
VMware Workstation is incompatible with device/credential guard. Disable device/credential guard









