提交 56b159de 编写于 作者: 雪洛's avatar 雪洛

fix: 修正不跨平台的用法

上级 192f66b9
...@@ -44,8 +44,8 @@ ...@@ -44,8 +44,8 @@
created() { created() {
uni.loadFontFace({ uni.loadFontFace({
global: false, global: false,
family: 'UniIconsFontFamily', family: 'UniIconsFontFamily',
source: iconpath, source: "url(" + iconpath + ")",
success() { }, success() { },
fail(err) { fail(err) {
console.log(err); console.log(err);
......
...@@ -19,8 +19,8 @@ export default { ...@@ -19,8 +19,8 @@ export default {
} }
}, },
onLoad(options: OnLoadOptions) { onLoad(options: OnLoadOptions) {
if (options.has('data')) { if (options['data'] != null) {
this.data = options.get('data')! this.data = options['data']
} }
}, },
methods: { methods: {
......
...@@ -36,7 +36,7 @@ export default { ...@@ -36,7 +36,7 @@ export default {
onShow(){ onShow(){
uni.loadFontFace({ uni.loadFontFace({
family: 'UniFontFamily', family: 'UniFontFamily',
source: 'static/font/uni.ttf' source: 'url(static/font/uni.ttf)'
}) })
}, },
methods: { methods: {
......
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
type="text" type="text"
placeholder="请输入value" placeholder="请输入value"
name="data" name="data"
:value="data" :value="typeof data === 'string' ? data : JSON.stringify(data)"
@input="dataChange" @input="dataChange"
/> />
</view> </view>
......
...@@ -11,10 +11,10 @@ ...@@ -11,10 +11,10 @@
<view class="title">性别</view> <view class="title">性别</view>
<radio-group name="gender" class="flex-row"> <radio-group name="gender" class="flex-row">
<view class="group-item"> <view class="group-item">
<radio :value="0" :checked="gender=='0'" /><text>男</text> <radio :value="'0'" :checked="gender=='0'" /><text>男</text>
</view> </view>
<view class="group-item"> <view class="group-item">
<radio :value="1" :checked="gender=='1'" /><text>女</text> <radio :value="'1'" :checked="gender=='1'" /><text>女</text>
</view> </view>
</radio-group> </radio-group>
</view> </view>
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
</view> </view>
<view class="uni-form-item"> <view class="uni-form-item">
<view class="title">年龄</view> <view class="title">年龄</view>
<slider name="age" :value="age" :show-value="true"></slider> <slider name="age" :value="age + ''" :show-value="true"></slider>
</view> </view>
<view class="uni-form-item"> <view class="uni-form-item">
<view class="title">保留选项</view> <view class="title">保留选项</view>
......
<template> <template>
<scroll-view> <scroll-view>
<page-head :title="title"></page-head> <page-head :title="title"></page-head>
<view class="uni-padding-wrap uni-common-mt"> <view class="uni-padding-wrap uni-common-mt">
<view class="uni-title"> <view class="uni-title">
<text class="uni-title-text">支持的图片格式示例</text> <text class="uni-title-text">支持的图片格式示例</text>
</view> </view>
<view v-for="(item,index) in supportFormats" :key="index"> <view v-for="(item,index) in supportFormats" :key="index">
<text class="uni-subtitle-text">{{item.format}}</text> <text class="uni-subtitle-text">{{item.format}}</text>
<view class="uni-center" style="background:#FFFFFF;"> <view class="uni-center" style="background:#FFFFFF;">
<image class="image" mode="widthFix" :src="item.src"></image> <image class="image" mode="widthFix" :src="item.src"></image>
</view> </view>
</view> </view>
<view class="uni-title"> <view class="uni-title">
<text class="uni-title-text">暂不支持的格式</text> <text class="uni-title-text">暂不支持的格式</text>
</view> </view>
<view v-for="(item,index) in notSupportFormats" :key="index"> <view v-for="(item,index) in notSupportFormats" :key="index">
<text class="uni-subtitle-text">{{item.format}}</text> <text class="uni-subtitle-text">{{item.format}}</text>
<view class="uni-center" style="background:#FFFFFF;"> <view class="uni-center" style="background:#FFFFFF;">
<image class="image" mode="widthFix" :src="item.src" @error="imageErrorEvent"></image> <image class="image" mode="widthFix" :src="item.errorImage == null ? item.src : item.errorImage"
</view> @error="imageErrorEvent(index, $event as ImageErrorEvent)"></image>
</view> </view>
</view> </view>
</scroll-view> </view>
</scroll-view>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
title: 'image-format', title: 'image-format',
supportFormats: [ supportFormats: [
{ {
format: 'bmp', format: 'bmp',
src: '/static/test-image/logo.bmp' src: '/static/test-image/logo.bmp'
}, },
{ {
format: 'gif', format: 'gif',
src: '/static/test-image/logo.gif' src: '/static/test-image/logo.gif'
}, },
{ {
format: 'ico', format: 'ico',
src: '/static/test-image/logo.ico' src: '/static/test-image/logo.ico'
}, },
{ {
format: 'jpg', format: 'jpg',
src: '/static/test-image/logo.jpg' src: '/static/test-image/logo.jpg'
}, },
{ {
format: 'png', format: 'png',
src: '/static/test-image/logo.png' src: '/static/test-image/logo.png'
}, },
{ {
format: 'webp', format: 'webp',
src: '/static/test-image/logo.webp' src: '/static/test-image/logo.webp'
}, },
{ {
format: 'heic(Android10+支持)', format: 'heic(Android10+支持)',
src: '/static/test-image/logo.heic' src: '/static/test-image/logo.heic'
} }
] as Array<ImageFormat>, ] as Array<ImageFormat>,
notSupportFormats: [ notSupportFormats: [
{ {
format: 'avif', format: 'avif',
src: '/static/test-image/logo.avif' src: '/static/test-image/logo.avif'
}, },
{ {
format: 'tif', format: 'tif',
src: '/static/test-image/logo.tif' src: '/static/test-image/logo.tif'
} }
] as Array<ImageFormat> ] as Array<ImageFormat>
} }
}, },
methods: { methods: {
imageErrorEvent(e : ImageErrorEvent) { imageErrorEvent(index: number, e: ImageErrorEvent) {
console.log("图片加载错误", e.detail); //TODO tif打不出正确的错误日志 console.log("图片加载错误", e.detail); //TODO tif打不出正确的错误日志
// 图片加载失败,加载本地占位图 // 图片加载失败,加载本地占位图
e.target?.setAttribute('src', '/static/template/drop-card/dislike.png') this.notSupportFormats[index].errorImage = '/static/template/drop-card/dislike.png'
} }
}, },
} }
type ImageFormat = { type ImageFormat = {
format : string format : string
src : string src : string
} errorImage ?: string | null
}
</script> </script>
<style> <style>
.image { .image {
margin: 40rpx auto; margin: 40rpx auto;
width: 200rpx; width: 200rpx;
} }
</style> </style>
\ No newline at end of file
...@@ -8,13 +8,13 @@ ...@@ -8,13 +8,13 @@
<view v-for="(item,index) in data" :key="index"> <view v-for="(item,index) in data" :key="index">
<text class="uni-subtitle-text">{{item.description}}</text> <text class="uni-subtitle-text">{{item.description}}</text>
<view class="uni-center" style="background:#FFFFFF;"> <view class="uni-center" style="background:#FFFFFF;">
<image class="image" mode="widthFix" :src="item.src" @error="imageErrorEvent"></image> <image class="image" mode="widthFix" :src="item.errorImage == null ? item.src : item.errorImage" @error="imageErrorEvent(index, $event as ImageErrorEvent)"></image>
</view> </view>
</view> </view>
<view> <view>
<text class="uni-subtitle-text">非static目录的src静态路径:./logo.png</text> <text class="uni-subtitle-text">非static目录的src静态路径:./logo.png</text>
<view class="uni-center" style="background:#FFFFFF;"> <view class="uni-center" style="background:#FFFFFF;">
<image class="image" mode="widthFix" src="./logo.png" @error="imageErrorEvent"></image> <image class="image" mode="widthFix" :src="outsideStaticErrorPath == null ? outsideStaticPath : outsideStaticErrorPath" @error="imageOutsideStaticErrorEvent"></image>
</view> </view>
</view> </view>
</view> </view>
...@@ -27,6 +27,8 @@ ...@@ -27,6 +27,8 @@
data() { data() {
return { return {
title: 'image-path', title: 'image-path',
outsideStaticPath: './logo.png',
outsideStaticErrorPath: null as string | null,
data: [ data: [
{ {
src: '/static/test-image/logo.png', src: '/static/test-image/logo.png',
...@@ -91,16 +93,21 @@ ...@@ -91,16 +93,21 @@
} }
}, },
methods: { methods: {
imageErrorEvent(e : ImageErrorEvent) { imageErrorEvent(index: number, e : ImageErrorEvent) {
console.log("图片加载错误", e.detail); console.log("图片加载错误", e.detail);
// 图片加载失败,加载本地占位图 // 图片加载失败,加载本地占位图
e.target?.setAttribute('src', '/static/template/drop-card/dislike.png') this.data[index].errorImage = '/static/template/drop-card/dislike.png'
},
imageOutsideStaticErrorEvent(e: ImageErrorEvent) {
console.log("图片加载错误", e.detail);
this.outsideStaticErrorPath = '/static/template/drop-card/dislike.png'
} }
}, },
} }
type ImagePath = { type ImagePath = {
src : string src : string
errorImage ?: string | null
description : string description : string
} }
</script> </script>
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<view v-for="(item,index) in supportFormats" :key="index"> <view v-for="(item,index) in supportFormats" :key="index">
<text class="uni-subtitle-text">{{item.format}}</text> <text class="uni-subtitle-text">{{item.format}}</text>
<video :id="'video-' + item.format" class="video" :src="item.src" :controls="true" :direction="-90" <video :id="'video-' + item.format" class="video" :src="item.src" :controls="true" :direction="-90"
@error="onError"></video> @error="onError(item.format, $event as VideoErrorEvent)"></video>
</view> </view>
<view class="uni-title"> <view class="uni-title">
<text class="uni-title-text">暂不支持的格式</text> <text class="uni-title-text">暂不支持的格式</text>
...@@ -78,10 +78,9 @@ ...@@ -78,10 +78,9 @@
} }
}, },
methods: { methods: {
onError: function (e : VideoErrorEvent) { onError: function (format: string, e : VideoErrorEvent) {
const id = e.target?.getAttribute("id"); console.log(format + ":" + e.detail);
console.log(id + ":" + e.detail); if (format != "video-错误路径") {
if (id != "video-错误路径") {
this.isError = true; this.isError = true;
} }
} }
......
// uni-app自动化测试教程: https://uniapp.dcloud.net.cn/worktile/auto/hbuilderx-extension/ // uni-app自动化测试教程: https://uniapp.dcloud.net.cn/worktile/auto/hbuilderx-extension/
describe('template-list-news', () => { describe('template-list-news', () => {
if (process.env.uniTestPlatformInfo.startsWith('web')) {
it('dummyTest', async () => {
expect(1).toBe(1)
})
return
}
let page; let page;
beforeAll(async () => { beforeAll(async () => {
page = await program.reLaunch('/pages/template/list-news/list-news'); page = await program.reLaunch('/pages/template/list-news/list-news');
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册