uview-plus组件库全面升级更新，订单结算判断支付方式是否可用代码调整，公众号关注二维码修改
This commit is contained in:
@@ -35,24 +35,14 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// #ifdef APP-NVUE
|
||||
// nvue通过weex的dom模块引入字体，相关文档地址如下：
|
||||
// https://weex.apache.org/zh/docs/modules/dom.html#addrule
|
||||
const fontUrl = 'https://at.alicdn.com/t/font_2225171_8kdcwk4po24.ttf'
|
||||
const domModule = weex.requireModule('dom')
|
||||
domModule.addRule('fontFace', {
|
||||
'fontFamily': "uicon-iconfont",
|
||||
'src': `url('${fontUrl}')`
|
||||
})
|
||||
// #endif
|
||||
|
||||
// 引入图标名称，已经对应的unicode
|
||||
import icons from './icons'
|
||||
import icons from './icons';
|
||||
import { props } from './props';
|
||||
import config from '../../libs/config/config';
|
||||
import { mpMixin } from '../../libs/mixin/mpMixin';
|
||||
import { mixin } from '../../libs/mixin/mixin';
|
||||
import { addUnit, addStyle } from '../../libs/function/index';
|
||||
import config from '../../libs/config/config';
|
||||
import fontUtil from './util';
|
||||
/**
|
||||
* icon 图标
|
||||
* @description 基于字体的图标集，包含了大多数常见场景的图标。
|
||||
@@ -82,18 +72,12 @@
|
||||
export default {
|
||||
name: 'u-icon',
|
||||
beforeCreate() {
|
||||
// #ifdef APP-NVUE
|
||||
if (this.customFontFamily) {
|
||||
domModule.addRule('fontFace', {
|
||||
'fontFamily': `${this.customPrefix}-${this.customFontFamily}`,
|
||||
'src': `url('${this.customFontUrl}')`
|
||||
})
|
||||
if (!fontUtil.params.loaded) {
|
||||
fontUtil.loadFont();
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
emits: ['click'],
|
||||
@@ -102,7 +86,7 @@
|
||||
uClasses() {
|
||||
let classes = []
|
||||
classes.push(this.customPrefix + '-' + this.name)
|
||||
// uView的自定义图标类名为u-iconfont
|
||||
// uview-plus内置图标类名为u-iconfont
|
||||
if (this.customPrefix == 'uicon') {
|
||||
classes.push('u-iconfont')
|
||||
} else {
|
||||
@@ -127,6 +111,9 @@
|
||||
// 某些特殊情况需要设置一个到顶部的距离，才能更好的垂直居中
|
||||
top: addUnit(this.top)
|
||||
}
|
||||
if (this.customPrefix !== 'uicon') {
|
||||
style.fontFamily = this.customPrefix
|
||||
}
|
||||
// 非主题色值时，才当作颜色值
|
||||
if (this.color && !config.type.includes(this.color)) style.color = this.color
|
||||
|
||||
@@ -147,7 +134,7 @@
|
||||
icon() {
|
||||
// 使用自定义图标的时候页面上会把name属性也展示出来，所以在这里处理一下
|
||||
if (this.customPrefix !== "uicon") {
|
||||
return this.customIcons[this.customPrefix + '-' + this.name] || this.name;
|
||||
return config.customIcons[this.name] || this.name;
|
||||
}
|
||||
// 如果内置的图标中找不到对应的图标，就直接返回name值，因为用户可能传入的是unicode代码
|
||||
return icons['uicon-' + this.name] || this.name
|
||||
@@ -166,8 +153,6 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "../../libs/css/components.scss";
|
||||
|
||||
// 变量定义
|
||||
$u-icon-primary: $u-primary !default;
|
||||
$u-icon-success: $u-success !default;
|
||||
@@ -176,13 +161,12 @@
|
||||
$u-icon-error: $u-error !default;
|
||||
$u-icon-label-line-height:1 !default;
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
// 非nvue下加载字体
|
||||
/* #ifdef APP || MP-QQ || MP-TOUTIAO || MP-BAIDU || MP-KUAISHOU || MP-XHS */
|
||||
// 2025/04/09在App/微信/支付宝/鸿蒙元服务已改用uni.loadFontFace加载字体
|
||||
@font-face {
|
||||
font-family: 'uicon-iconfont';
|
||||
src: url('https://at.alicdn.com/t/font_2225171_8kdcwk4po24.ttf') format('truetype');
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
|
||||
.u-icon {
|
||||
|
||||
68
uni_modules/uview-plus/components/u-icon/util.js
Normal file
68
uni_modules/uview-plus/components/u-icon/util.js
Normal file
@@ -0,0 +1,68 @@
|
||||
import config from '../../libs/config/config';
|
||||
|
||||
let params = {
|
||||
loaded: false
|
||||
};
|
||||
// 加载字体方法
|
||||
const loadFont = () => {
|
||||
// console.log('加载字体图标');
|
||||
// 全局加载不稳定，默认关闭，需要开启可以配置loadFontOnce。
|
||||
if (config.loadFontOnce) {
|
||||
params.loaded = true;
|
||||
}
|
||||
// #ifdef APP-NVUE
|
||||
// nvue通过weex的dom模块引入字体，相关文档地址如下：
|
||||
// https://weex.apache.org/zh/docs/modules/dom.html#addrule
|
||||
const domModule = weex.requireModule('dom');
|
||||
domModule.addRule('fontFace', {
|
||||
'fontFamily': "uicon-iconfont",
|
||||
'src': `url('${config.iconUrl}')`
|
||||
});
|
||||
if (config.customIcon.family) {
|
||||
domModule.addRule('fontFace', {
|
||||
'fontFamily': config.customIcon.family,
|
||||
'src': `url('${config.customIcon.url}')`
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
// #ifdef APP || H5 || MP-WEIXIN || MP-ALIPAY
|
||||
uni.loadFontFace({
|
||||
global: true, // 是否全局生效。微信小程序 '2.10.0'起支持全局生效，需在 app.vue 中调用。
|
||||
family: 'uicon-iconfont',
|
||||
source: 'url("' + config.iconUrl + '")',
|
||||
success() {
|
||||
// console.log('内置字体图标加载成功');
|
||||
},
|
||||
fail() {
|
||||
// console.error('内置字体图标加载出错');
|
||||
}
|
||||
});
|
||||
if (config.customIcon.family) {
|
||||
uni.loadFontFace({
|
||||
global: true, // 是否全局生效。微信小程序 '2.10.0'起支持全局生效，需在 app.vue 中调用。
|
||||
family: config.customIcon.family,
|
||||
source: 'url("' + config.customIcon.url + '")',
|
||||
success() {
|
||||
// console.log('扩展字体图标加载成功');
|
||||
},
|
||||
fail() {
|
||||
// console.error('扩展字体图标加载出错');
|
||||
}
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
// #ifdef APP-NVUE
|
||||
// if (this.customFontFamily) {
|
||||
// domModule.addRule('fontFace', {
|
||||
// 'fontFamily': `${this.customPrefix}-${this.customFontFamily}`,
|
||||
// 'src': `url('${this.customFontUrl}')`
|
||||
// })
|
||||
// }
|
||||
// #endif
|
||||
return true;
|
||||
};
|
||||
|
||||
export default {
|
||||
params: params,
|
||||
loadFont
|
||||
}
|
||||
Reference in New Issue
Block a user