vue项目开发移动端、小程序项目的好帮手

前言：

        目前我们在开发移动端h5项目，小程序项目能使用的功能是有很多的，比如vant移动端，vant小程序端，这里我们说一说uview 这个帮手。

框架官网：

vant移动端

vant小程序端

uview

框架优点：

• 适合跨段使用，比如uni-app里面，或者开发h5项目、小程序项目均能胜任
• 功能相比较vant更加丰富（个人观点）
• 他的官网稳定性更高，像我直接经常遇到vant官网进不去的情况，uview没有遇到过

效果展示：

操作步骤：

1、安装

uni-app的插件下载，地址：uView2.0重磅发布，利剑出鞘，一统江湖 - DCloud 插件市场

npm install uview-ui@2.0.36

2、main.js默认引入

// main.js
import uView from 'uview-ui'
Vue.use(uView)

如果想修改默认属性，main.js中加入

// 调用setConfig方法，方法内部会进行对象属性深度合并，可以放心嵌套配置
// 需要在Vue.use(uView)之后执行
uni.$u.setConfig({
	// 修改$u.config对象的属性
	config: {
		// 修改默认单位为rpx，相当于执行 uni.$u.config.unit = 'rpx'
		unit: 'rpx'
	},
	// 修改$u.props对象的属性
	props: {
		// 修改radio组件的size参数的默认值，相当于执行 uni.$u.props.radio.size = 30
		radio: {
			size: 15
		}
		// 其他组件属性配置
		// ......
	}
})

3、页面样式修改

温馨提示

由于uView的内置样式均是写在scss文件中的，您在使用的时候，请确保要给页面的style标签加上lang="scss"属性，否则可能会报错。

4、具体代码使用

<u-button text="月落"></u-button>