提交 e57d3b9c 编写于 作者: Y yurj26

refactor: support uvue and vue

上级 76cf1a30
/* #ifndef APP-PLUS-NVUE */
/* page {
min-height: 100%;
height: auto;
} */
/* #endif */
/* 解决头条小程序字体图标不显示问题,因为头条运行时自动插入了span标签,且有全局字体 */
/* #ifdef MP-TOUTIAO */
/* text :not(view) {
font-family: uniicons;
} */
/* #endif */
.uni-icon {
/* font-family: uniicons;
font-weight: normal; */
width: 14px;
height: 14px;
}
.uni-container {
padding: 0 15px 15px;
background-color: #f8f8f8;
}
.uni-header-logo {
/* #ifdef H5 */
display: flex;
/* #endif */
padding: 15px 15px;
flex-direction: column;
justify-content: center;
align-items: center;
margin-top: 10rpx;
}
.uni-header-image {
width: 80px;
height: 80px;
}
.uni-hello-text {
margin-bottom: 20px;
color: #7A7E83;
}
.hello-text {
color: #7A7E83;
font-size: 14px;
line-height: 20px;
}
.hello-link {
color: #7A7E83;
font-size: 14px;
line-height: 20px;
}
.uni-panel {
margin-bottom: 12px;
}
.text-disabled {
color: #a0a0a0;
}
.uni-panel-h {
display: flex;
background-color: #ffffff;
flex-direction: row !important;
justify-content: space-between !important;
align-items: center !important;
padding: 12px;
}
/*
.uni-panel-h:active {
background-color: #f8f8f8;
}
*/
.uni-panel-h-on {
background-color: #f0f0f0;
}
.uni-panel-text {
color: #000000;
font-size: 14px;
font-weight: normal;
}
.uni-panel-icon {
margin-left: 15px;
color: #999999;
font-size: 14px;
font-weight: normal;
transform: rotate(0deg);
transition-duration: 0s;
transition-property: transform;
}
.uni-panel-icon-on {
transform: rotate(180deg);
}
.uni-navigate-item {
display: flex;
flex-direction: row;
align-items: center;
background-color: #FFFFFF;
border-top-style: solid;
border-top-color: #f0f0f0;
border-top-width: 1px;
padding: 12px;
justify-content: space-between;
/* #ifdef H5 */
/* cursor: pointer; */
/* #endif */
}
.uni-navigate-item-active {
background-color: #f8f8f8;
}
.uni-navigate-text {
color: #000000;
font-size: 14px;
font-weight: normal;
}
.uni-navigate-icon {
margin-left: 15px;
color: #999999;
font-size: 14px;
font-weight: normal;
}
\ No newline at end of file
此差异已折叠。
<template name="page-head">
<view class="common-page-head">
<view class="common-page-head-title">{{title}}</view>
<view class="common-page-head-title-box">
<text class="common-page-head-title">{{title}}</text>
</view>
</view>
</template>
<script>
......@@ -14,3 +16,23 @@
}
}
</script>
<style>
.common-page-head {
display: flex;
padding: 35rpx;
flex-direction: row;
justify-content: center;
}
.common-page-head-title-box {
padding: 0 40rpx;
height: 88rpx;
border-bottom: 2rpx solid #D8D8D8;
}
.common-page-head-title {
line-height: 88rpx;
font-size: 30rpx;
color: #BEBEBE;
}
</style>
\ No newline at end of file
import App from './App'
// #ifndef VUE3
import Vue from 'vue'
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
...App
})
app.$mount()
// #endif
// #ifdef VUE3
import { createSSRApp } from 'vue'
export function createApp() {
const app = createSSRApp(App)
return {
app
}
}
\ No newline at end of file
// #endif
\ No newline at end of file
......@@ -158,10 +158,10 @@
}
},
{
"path": "pages/test/index",
"style": {
"path" : "pages/SyntaxCase/basicTest",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
......
......@@ -8,15 +8,15 @@
<button @tap="changeAction(1)">测试action play</button>
<button @tap="changeAction(2)">测试action pause</button>
<button @tap="changeAction(3)">测试action stop</button>
<uts-animation-view ref="animView" :path="animUrl" :autoplay="autoplay" :loop="loop" :action="action"
<!-- <uts-animation-view ref="animView" :path="animUrl" :autoplay="autoplay" :loop="loop" :action="action"
:hidden="hidden" @bindended="testAnimEnd" @click="lottieClickTest" @longpress="lottieLongpressTest"
:style="{width:widthNum+'rpx',height:heightNum+'px',background:yanse}">
</uts-animation-view>
</uts-animation-view> -->
</div>
</template>
<script>
<script lang="ts">
export default {
data() {
......@@ -49,7 +49,7 @@
changeServerUrl: function() {
this.animUrl = "https://b.bdstatic.com/miniapp/images/lottie_example_one.json"
},
changeAction: function(type) {
changeAction: function(type: number) {
if (type == 1) {
this.action = "play"
} else if (type == 2) {
......@@ -61,21 +61,18 @@
changeLoop: function() {
this.loop = !this.loop
},
testAnimEnd: function(res) {
testAnimEnd: function() {
console.log("testAnimEnd");
console.log(res);
},
changeRepeat: function(res) {
this.$refs["animView"].updateRepeatConfig("RESTART");
changeRepeat: function() {
// this.$refs["animView"].updateRepeatConfig("RESTART");
},
lottieClickTest: function(res) {
lottieClickTest: function() {
console.log("lottieClickTest");
console.log(res);
},
lottieLongpressTest: function(res) {
lottieLongpressTest: function() {
console.log("lottieClickTest");
console.log(res);
},
}
}
......
<template>
<view>
<view class="uni-container">
<page-head :title="title"></page-head>
<uni-list>
<uni-list-item @tap="gotoTencentLocation" title="腾讯定位sdk集成示例" class="itemButton" :clickable="true" link/>
<uni-list-item @tap="gotoToast" title="Toast示例" class="itemButton" :clickable="true" link/>
<uni-list-item @tap="gotoLottie" title="Lottie动画示例" class="itemButton" :clickable="true" link/>
</uni-list>
<view class="uni-panel" v-for="(item, index) in list" :key="index">
<view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="goDetailPage(item)"
hover-class="uni-navigate-item-active">
<text class="uni-panel-text">{{item.name}}</text>
<image :src="arrowRightIcon" class="uni-icon"></image>
</view>
</view>
</view>
</template>
<script lang="ts">
// import {
// checkHasIntegration
// } from "@/uni_modules/uts-tencentgeolocation";
<script>
// import {
// checkHasLottieIntegration
// } from "@/uni_modules/uts-animation-view";
import {
checkHasIntegration
} from "@/uni_modules/uts-tencentgeolocation";
import {
checkHasLottieIntegration
} from "@/uni_modules/uts-animation-view";
type ListItem = {
name : string,
open : boolean,
function ?: string,
url ?: string
}
export default {
data() {
return {
title: 'SDK集成示例',
list: [{
name: "腾讯定位sdk集成示例",
function: "gotoTencentLocation"
},
{
name: "Toast示例",
url: "SDKIntegration/Toast/Toast"
},
{
name: "Lottie动画示例",
function: "gotoLottie"
}
] as ListItem[],
arrowRightIcon: '/static/icons/arrow-right.png',
}
},
methods: {
gotoToast:function(e){
goDetailPage(e : ListItem) {
if (e.function != null) {
const funName = e.function
switch (funName) {
case 'gotoTencentLocation':
this.gotoTencentLocation()
break
case 'gotoLottie':
this.gotoLottie()
break
}
return
}
uni.navigateTo({
url:'/pages/SDKIntegration/Toast/Toast'
url: `/pages/${e.url!}`
})
},
gotoLottie:function(e){
if(checkHasLottieIntegration()){
uni.navigateTo({
url:'/pages/SDKIntegration/Lottie/index'
})
}else{
uni.showToast({
icon:'none',
title:'需要在自定义基座中运行'
})
}
gotoLottie: function () {
// if (checkHasLottieIntegration()) {
// uni.navigateTo({
// url: '/pages/SDKIntegration/Lottie/index'
// })
// } else {
// uni.showToast({
// icon: 'none',
// title: '需要在自定义基座中运行'
// })
// }
},
gotoTencentLocation:function(e){
let ret = checkHasIntegration();
if(!ret){
uni.showToast({
icon:'none',
title:'需要在自定义基座中运行'
})
}else{
uni.navigateTo({
url:'/pages/SDKIntegration/TencentLocation/TencentLocation'
})
}
gotoTencentLocation: function () {
// let ret = checkHasIntegration();
// if (!ret) {
// uni.showToast({
// icon: 'none',
// title: '需要在自定义基座中运行'
// })
// } else {
// uni.navigateTo({
// url: '/pages/SDKIntegration/TencentLocation/TencentLocation'
// })
// }
},
gotoTencentMap:function(e){
gotoTencentMap: function () {
uni.navigateTo({
url:'/pages/SDKIntegration/TencentMap/TencentMap'
url: '/pages/SDKIntegration/TencentMap/TencentMap'
})
}
}
......@@ -70,5 +101,5 @@
</script>
<style>
@import '@/common/uni-uvue.css';
</style>
\ No newline at end of file
<template>
<view>
<view class="uni-container">
<page-head :title="title"></page-head>
<uni-list>
<uni-list-item @tap="gotoTencentLocation" title="腾讯定位sdk集成示例" class="itemButton" :clickable="true" link/>
<uni-list-item @tap="gotoToast" title="Toast示例" class="itemButton" :clickable="true" link/>
<uni-list-item @tap="gotoLottie" title="Lottie动画示例" class="itemButton" :clickable="true" link/>
</uni-list>
<view class="uni-panel" v-for="(item, index) in list" :key="index">
<view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="goDetailPage(item)" hover-class="uni-navigate-item-active">
<text class="uni-panel-text">{{item.name}}</text>
<image :src="arrowRightIcon" class="uni-icon"></image>
</view>
</view>
</view>
</template>
<script>
import {
checkHasIntegration
} from "@/uni_modules/uts-tencentgeolocation";
......@@ -23,46 +23,63 @@
data() {
return {
title: 'SDK集成示例',
list: [{
name: "腾讯定位sdk集成示例",
function: "gotoTencentLocation"
},
{
name: "Toast示例",
url: "SDKIntegration/Toast/Toast"
},
{
name: "Lottie动画示例",
function: "gotoLottie"
}
],
arrowRightIcon: '/static/icons/arrow-right.png',
}
},
methods: {
gotoToast:function(e){
goDetailPage(e) {
if (e.function) {
this[e.function]()
return
}
uni.navigateTo({
url:'/pages/SDKIntegration/Toast/Toast'
url: `/pages/${e.url}`
})
},
gotoLottie:function(e){
if(checkHasLottieIntegration()){
gotoLottie: function(e) {
if (checkHasLottieIntegration()) {
uni.navigateTo({
url:'/pages/SDKIntegration/Lottie/index'
url: '/pages/SDKIntegration/Lottie/index'
})
}else{
} else {
uni.showToast({
icon:'none',
title:'需要在自定义基座中运行'
icon: 'none',
title: '需要在自定义基座中运行'
})
}
},
gotoTencentLocation:function(e){
gotoTencentLocation: function(e) {
let ret = checkHasIntegration();
if(!ret){
if (!ret) {
uni.showToast({
icon:'none',
title:'需要在自定义基座中运行'
icon: 'none',
title: '需要在自定义基座中运行'
})
}else{
} else {
uni.navigateTo({
url:'/pages/SDKIntegration/TencentLocation/TencentLocation'
url: '/pages/SDKIntegration/TencentLocation/TencentLocation'
})
}
},
gotoTencentMap:function(e){
gotoTencentMap: function(e) {
uni.navigateTo({
url:'/pages/SDKIntegration/TencentMap/TencentMap'
url: '/pages/SDKIntegration/TencentMap/TencentMap'
})
}
}
......@@ -70,5 +87,9 @@
</script>
<style>
@import '@/common/uni-uvue.css';
.uni-container {
min-height: 100%;
}
</style>
\ No newline at end of file
......@@ -22,13 +22,13 @@
</template>
<script>
import {
checkHasIntegration,
requestPremission,
getLocation,
watchPosition,
clearWatch
} from "@/uni_modules/uts-tencentgeolocation";
// import {
// checkHasIntegration,
// requestPremission,
// getLocation,
// watchPosition,
// clearWatch
// } from "../../../uni_modules/uts-tencentgeolocation";
export default {
data() {
......@@ -38,58 +38,58 @@
},
methods: {
checkLocationPermission: function(e) {
requestPremission();
checkLocationPermission: function() {
// requestPremission();
},
testGetlocation: function(e) {
testGetlocation: function() {
let startRet = getLocation({
geocode: true,
success: function(response) {
console.log(response);
var addressDesc = response.name + '-' + response.address
uni.showToast({
title: '执行结果:' + addressDesc,
icon: 'none'
});
},
fail: function(msg) {
uni.showToast({
title: msg,
icon: "none"
})
}
})
// let startRet = getLocation({
// geocode: true,
// success: function(response) {
// console.log(response);
// var addressDesc = response.name + '-' + response.address
// uni.showToast({
// title: '执行结果:' + addressDesc,
// icon: 'none'
// });
// },
// fail: function(msg) {
// uni.showToast({
// title: msg,
// icon: "none"
// })
// }
// })
if (!startRet) {
uni.showToast({
title: '定位启动失败,请检查配置',
icon: 'none'
});
}
// if (!startRet) {
// uni.showToast({
// title: '定位启动失败,请检查配置',
// icon: 'none'
// });
// }
},
testWatchPosition() {
watchPosition({
geocode: true,
success: function(response) {
console.log(response);
var addressDesc = response.name + '-' + response.address
uni.showToast({
title: '执行结果:' + addressDesc,
icon: 'none'
});
},
fail: function(msg) {
uni.showToast({
title: msg,
icon: "none"
})
}
})
// watchPosition({
// geocode: true,
// success: function(response) {
// console.log(response);
// var addressDesc = response.name + '-' + response.address
// uni.showToast({
// title: '执行结果:' + addressDesc,
// icon: 'none'
// });
// },
// fail: function(msg) {
// uni.showToast({
// title: msg,
// icon: "none"
// })
// }
// })
},
testClearWatch() {
clearWatch()
// clearWatch()
}
}
}
......
此差异已折叠。
<template>
{{ret}}
<button @click="instanceCreate">多实例创建测试</button>
</template>
<script>
import {
User
} from '@/uni_modules/uts-advance'
export default {
data() {
return {
ret:''
}
},
methods: {
instanceCreate() {
const user1 = new User("张三", 20);
let userText1 = user1.describeSelf()
const user2 = new User("李四", 30);
let userText2 = user2.describeSelf()
const user3 = new User("王五", 40);
let userText3 = user3.describeSelf()
if(userText1 == userText2 || userText1 == userText3 || userText2 == userText3){
this.ret = '测试未通过'
}else{
this.ret = '测试通过'
}
}
}
}
</script>
<style>
</style>
\ No newline at end of file
......@@ -15,6 +15,7 @@
returnParam,
callbackArray,
callbackParam,
ParamOptions
} from '@/uni_modules/uts-advance'
......@@ -38,7 +39,7 @@
let ret = inputParam({
title: "hello",
array: ["1", "2", "3"]
})
} as ParamOptions)
if (ret) {
uni.showToast({
title: '测试通过'
......
......@@ -23,7 +23,7 @@
testShowAlert(){
showAlert("提示框","这是一个提示框", (index)=> {
var title = null
let title:string
if (index == 0) {
title = "点击了确认"
} else{
......
......@@ -2,10 +2,8 @@
<view>
<page-head title="监听系统截屏" accordion></page-head>
<uni-list>
<uni-list-item @tap="testScreenShotListen" title="监听截屏事件" class="itemButton" :clickable="true"/>
<uni-list-item @tap="testScreenShotOff" title="关闭截屏监听" class="itemButton" :clickable="true"/>
</uni-list>
<button @click="testScreenShotListen">监听截屏事件</button>
<button @click="testScreenShotOff">关闭截屏监听</button>
<image :src="screenImage" mode="aspectFit" style="margin-top:10px"></image>
......@@ -47,7 +45,9 @@
icon:"none",
title:'捕获截屏事件'
})
that.screenImage = res.image
if (res.image != null) {
that.screenImage = res.image!
}
}
}else{
// 除android 之外的平台,不需要判断返回状态码
......
......@@ -2,10 +2,8 @@
<view>
<page-head title="监听系统截屏" accordion></page-head>
<uni-list>
<uni-list-item @tap="testScreenShotListen" title="监听截屏事件" class="itemButton" :clickable="true"/>
<uni-list-item @tap="testScreenShotOff" title="关闭截屏监听" class="itemButton" :clickable="true"/>
</uni-list>
<button @click="testScreenShotListen">监听截屏事件</button>
<button @click="testScreenShotOff">关闭截屏监听</button>
<image :src="screenImage" mode="aspectFit" style="margin-top:10px"></image>
......
<template>
<view>
<view class="uni-container">
<page-head :title="title"></page-head>
<uni-collapse>
<uni-collapse-item title="设备相关" :border="false">
<uni-list>
<uni-list-item @tap="testGetBatteryCapacity" title="获取电池电量" class="itemButton" :clickable="true"/>
</uni-list>
</uni-collapse-item>
</uni-collapse>
<uni-collapse>
<uni-collapse-item title="系统事件" :border="false">
<uni-list>
<uni-list-item @tap="gotoScreenListen" title="监听系统截屏" class="itemButton" :clickable="true" link/>
</uni-list>
</uni-collapse-item>
</uni-collapse>
<uni-collapse>
<uni-collapse-item title="Alert系统弹窗" :border="false">
<uni-list>
<uni-list-item @tap="gotoAlert" title="Alert弹窗" class="itemButton" :clickable="true" link/>
</uni-list>
</uni-collapse-item>
</uni-collapse>
<uni-collapse>
<uni-collapse-item title="android平台" :border="false">
<uni-list>
<uni-list-item @tap="testGotoDemoActivity" title="自定义activity(需自定义基座)" class="itemButton" :clickable="true" link/>
</uni-list>
</uni-collapse-item>
</uni-collapse>
<view class="uni-panel" v-for="(item, index) in list" :key="index">
<view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="triggerCollapse(index)">
<text class="uni-panel-text">{{item.name}}</text>
<image :src="item.pages.length > 0 ? item.open ? arrowUpIcon : arrowDownIcon : arrowRightIcon"
class="uni-icon"></image>
</view>
<view class="uni-panel-c" v-if="item.open">
<view class="uni-navigate-item" v-for="(page,key) in item.pages" :key="key" @click="goDetailPage(page)" hover-class="uni-navigate-item-active">
<text class="uni-navigate-text">{{page.name}}</text>
<image :src="arrowRightIcon" class="uni-icon" v-if="page.url"></image>
</view>
</view>
</view>
</view>
</template>
<script>
import gotoDemoActivity from "@/uni_modules/uts-nativepage";
import getBatteryInfo from "@/uni_modules/uts-getbatteryinfo";
<script lang="ts">
import { gotoDemoActivity } from "@/uni_modules/uts-nativepage";
import { getBatteryInfo, GetBatteryInfoOptions } from "@/uni_modules/uts-getbatteryinfo";
type Page = {
name : string,
url ?: string
function ?: string
}
type ListItem = {
name : string,
open : boolean,
pages : Page[],
}
export default {
data() {
return {
title: '系统API示例',
list: [{
name: "设备相关",
open: false,
pages: [{
name: "获取电池电量",
function: "testGetBatteryCapacity"
}] as Page[]
},
{
name: "系统事件",
open: false,
pages: [{
name: "监听系统截屏",
url: "SystemAPI/ScreenListen/screenlisten"
}] as Page[]
},
{
name: "Alert系统弹窗",
open: false,
pages: [{
name: "Alert弹窗",
url: "SystemAPI/Alert/alert"
}] as Page[]
},
{
name: "android平台",
open: false,
pages: [{
name: "自定义activity(需自定义基座)",
function: "testGotoDemoActivity"
}] as Page[]
}
] as ListItem[],
arrowUpIcon: '/static/icons/arrow-up.png',
arrowDownIcon: '/static/icons/arrow-down.png',
arrowRightIcon: '/static/icons/arrow-right.png',
}
},
onUnload: function() {},
methods: {
triggerCollapse(index: number) {
for (var i = 0; i < this.list.length; ++i) {
if (index == i) {
this.list[i].open = !this.list[i].open;
} else {
this.list[i].open = false;
}
}
},
goDetailPage(e: Page) {
if (e.function != null) {
const funName = e.function
switch (funName) {
case 'testGetBatteryCapacity':
this.testGetBatteryCapacity()
break
case 'testGotoDemoActivity':
this.testGotoDemoActivity()
break
}
return
}
uni.navigateTo({
url: `/pages/${e.url}`
})
},
testGetBatteryCapacity() {
getBatteryInfo({
success(res) {
uni.showToast({
title: "当前电量:" + res.level + '%',
title: "当前电量:" + (res as UTSJSONObject)['level'] + '%',
icon: 'none'
});
}
})
},
gotoScreenListen(){
uni.navigateTo({
url:'/pages/SystemAPI/ScreenListen/screenlisten'
})
},
gotoAlert(){
uni.navigateTo({
url:'/pages/SystemAPI/Alert/alert'
})
} as GetBatteryInfoOptions)
},
testGotoDemoActivity() {
let ret = gotoDemoActivity();
if(!ret){
if (!ret) {
uni.showToast({
icon:'none',
title:'需要在自定义基座中运行'
icon: 'none',
title: '需要在自定义基座中运行'
})
}
}
}
}
</script>
<style>
.screenImage{
width: 100%;
height: 380px;
}
@import '@/common/uni-uvue.css';
</style>
\ No newline at end of file
<template>
<view>
<view class="uni-container">
<page-head :title="title"></page-head>
<uni-collapse>
<uni-collapse-item title="设备相关" :border="false">
<uni-list>
<uni-list-item @tap="testGetBatteryCapacity" title="获取电池电量" class="itemButton" :clickable="true"/>
</uni-list>
</uni-collapse-item>
</uni-collapse>
<uni-collapse>
<uni-collapse-item title="系统事件" :border="false">
<uni-list>
<uni-list-item @tap="gotoScreenListen" title="监听系统截屏" class="itemButton" :clickable="true" link/>
</uni-list>
</uni-collapse-item>
</uni-collapse>
<uni-collapse>
<uni-collapse-item title="Alert系统弹窗" :border="false">
<uni-list>
<uni-list-item @tap="gotoAlert" title="Alert弹窗" class="itemButton" :clickable="true" link/>
</uni-list>
</uni-collapse-item>
</uni-collapse>
<uni-collapse>
<uni-collapse-item title="android平台" :border="false">
<uni-list>
<uni-list-item @tap="testGotoDemoActivity" title="自定义activity(需自定义基座)" class="itemButton" :clickable="true" link/>
</uni-list>
</uni-collapse-item>
</uni-collapse>
<view class="uni-panel" v-for="(item, index) in list" :key="index">
<view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="triggerCollapse(index, item)">
<text class="uni-panel-text">{{item.name}}</text>
<image :src="item.pages.length > 0 ? item.open ? arrowUpIcon : arrowDownIcon : arrowRightIcon"
class="uni-icon"></image>
</view>
<view class="uni-panel-c" v-if="item.open">
<view class="uni-navigate-item" v-for="(page,key) in item.pages" :key="key" @click="goDetailPage(page)" hover-class="uni-navigate-item-active">
<text class="uni-navigate-text">{{page.name}}</text>
<image :src="arrowRightIcon" class="uni-icon" v-if="page.url"></image>
</view>
</view>
</view>
</template>
</view>
</template>·
<script>
import gotoDemoActivity from "@/uni_modules/uts-nativepage";
import getBatteryInfo from "@/uni_modules/uts-getbatteryinfo";
import { gotoDemoActivity } from "@/uni_modules/uts-nativepage";
import { getBatteryInfo } from "@/uni_modules/uts-getbatteryinfo";
export default {
data() {
return {
title: '系统API示例',
list: [{
name: "设备相关",
open: false,
pages: [{
name: "获取电池电量",
function: "testGetBatteryCapacity"
}]
},
{
name: "系统事件",
open: false,
pages: [{
name: "监听系统截屏",
url: "SystemAPI/ScreenListen/screenlisten"
}]
},
{
name: "Alert系统弹窗",
open: false,
pages: [{
name: "Alert弹窗",
url: "SystemAPI/Alert/alert"
}]
},
{
name: "android平台",
open: false,
pages: [{
name: "自定义activity(需自定义基座)",
function: "testGotoDemoActivity"
}]
}
],
arrowUpIcon: '/static/icons/arrow-up.png',
arrowDownIcon: '/static/icons/arrow-down.png',
arrowRightIcon: '/static/icons/arrow-right.png',
}
},
onUnload: function() {},
methods: {
triggerCollapse(index) {
for (var i = 0; i < this.list.length; ++i) {
if (index == i) {
this.list[i].open = !this.list[i].open;
} else {
this.list[i].open = false;
}
}
},
goDetailPage(e) {
if (e.function) {
this[e.function]()
return
}
uni.navigateTo({
url: `/pages/${e.url}`
})
},
testGetBatteryCapacity() {
getBatteryInfo({
success(res) {
......@@ -61,34 +94,23 @@
}
})
},
gotoScreenListen(){
uni.navigateTo({
url:'/pages/SystemAPI/ScreenListen/screenlisten'
})
},
gotoAlert(){
uni.navigateTo({
url:'/pages/SystemAPI/Alert/alert'
})
},
testGotoDemoActivity() {
let ret = gotoDemoActivity();
if(!ret){
if (!ret) {
uni.showToast({
icon:'none',
title:'需要在自定义基座中运行'
icon: 'none',
title: '需要在自定义基座中运行'
})
}
}
}
}
</script>
<style>
.screenImage{
width: 100%;
height: 380px;
}
@import '@/common/uni-uvue.css';
.uni-container {
min-height: 100%;
}
</style>
\ No newline at end of file
<template>
<view>
<page-head :title="title" accordion></page-head>
<uni-collapse accordion>
<uni-collapse-item title="延迟任务" :border="false">
<uni-list>
<uni-list-item @tap="testTimer" title="开启延迟任务" :clickable="true">
</uni-list-item>
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="定时任务" :border="false">
<uni-list>
<uni-list-item @tap="testInterval" title="开启定时任务" :clickable="true">
</uni-list-item>
<uni-list-item @tap="testClearInterval" title="关闭定时任务" :clickable="true">
</uni-list-item>
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="语法示例" :border="false">
<uni-list>
<uni-list-item @tap="testSyntax" title="进阶语法示例" :clickable="true" link>
</uni-list-item>
<uni-list-item @tap="testParams" title="参数传递示例" :clickable="true" link>
</uni-list-item>
<uni-list-item @tap="testConsole" title="日志打印示例" :clickable="true" link>
</uni-list-item>
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="资源加载示例" :border="false">
<uni-list>
<uni-list-item @tap="gotoResourceDemo" title="图片加载示例" :clickable="true" link>
</uni-list-item>
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="组件开发示例" :border="false">
<uni-list>
<uni-list-item @tap="testHelloUTSComponent" title="Hello UTS Component" :clickable="true" link />
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="android平台示例" :border="false">
<uni-list>
<uni-list-item @tap="testLifecyle" title="activity生命周期监听" :clickable="true" link />
<uni-list-item @tap="testAssetLoad" title="播放asset音频(需自定义基座)" :clickable="true" link/>
<uni-list-item @tap="gotoDecorView" title="操作DecorView" :clickable="true" link />
<uni-list-item @tap="testMetaRead" title="读取meta配置" :clickable="true" />
<uni-list-item @tap="testQuitApp" title="退出当前应用" :clickable="true" />
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="iOS平台示例" :border="false">
<uni-list>
<uni-list-item @tap="testGetResourcePath" title="资源路径获取示例" :clickable="true" link />
</uni-list>
</uni-collapse-item>
</uni-collapse>
<view class="uni-container">
<page-head :title="title"></page-head>
<view class="uni-panel" v-for="(item, index) in list" :key="index">
<view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="triggerCollapse(index)">
<text class="uni-panel-text">{{item.name}}</text>
<image :src="item.pages.length > 0 ? item.open ? arrowUpIcon : arrowDownIcon : arrowRightIcon"
class="uni-icon"></image>
</view>
<view class="uni-panel-c" v-if="item.open">
<view class="uni-navigate-item" v-for="(page,key) in item.pages" :key="key" @click="goDetailPage(page)"
hover-class="uni-navigate-item-active">
<text class="uni-navigate-text">{{page.name}}</text>
<image :src="arrowRightIcon" class="uni-icon" v-if="page.url"></image>
</view>
</view>
</view>
</view>
</template>
<script>
<script lang="ts">
import {
doTimerTask,
doIntervalTask,
clearIntervalTask,
playAssetAudio,
getMetaConfig,
quitApp
quitApp,
TimerOptions
} from "../../uni_modules/uts-advance";
type Page = {
name : string,
url ?: string
function ?: string
}
type ListItem = {
name : string,
open : boolean,
pages : Page[],
}
export default {
data() {
return {
title: 'UTS进阶示例',
taskId: 0,
list: [{
name: "延迟任务",
open: false,
pages: [{
name: "开启延迟任务",
function: "testTimer"
}] as Page[]
},
{
name: "定时任务",
open: false,
pages: [{
name: "开启定时任务",
function: "testInterval"
}, {
name: "关闭定时任务",
function: "testClearInterval"
}] as Page[]
},
{
name: "语法示例",
open: false,
pages: [{
name: "进阶语法示例",
url: "SyntaxCase/index"
}, {
name: "参数传递示例",
url: "SyntaxCase/paramTest"
}, {
name: "日志打印示例",
url: "SyntaxCase/consoleTest"
}, {
name: "实例测试示例",
url: "SyntaxCase/instanceTest"
}, {
name: "基础语法测试例",
url: "SyntaxCase/basicTest"
}] as Page[]
},
{
name: "资源加载示例",
open: false,
pages: [{
name: "图片加载示例",
url: "resource/resource"
}, {
name: "文件读取示例",
url: "resource/fileRead"
}] as Page[]
},
{
name: "组件开发示例",
open: false,
pages: [{
name: "Hello UTS Component",
url: "component/helloView"
}] as Page[]
},
{
name: "android平台示例",
open: false,
pages: [{
name: "activity生命周期监听",
url: "lifecycle/lifecycle"
}, {
name: "播放asset音频(需自定义基座)",
url: "advance/android/assetaudio"
}, {
name: "操作DecorView",
url: "advance/android/decorview"
}, {
name: "读取meta配置",
function: "testMetaRead"
}, {
name: "退出当前应用",
function: "testQuitApp"
}] as Page[]
},
{
name: "iOS平台示例",
open: false,
pages: [{
name: "资源路径获取示例",
url: "advance/iOS/getResourcePath"
}] as Page[]
},
] as ListItem[],
arrowUpIcon: '/static/icons/arrow-up.png',
arrowDownIcon: '/static/icons/arrow-down.png',
arrowRightIcon: '/static/icons/arrow-right.png',
}
},
methods: {
triggerCollapse(index : number) {
for (var i = 0; i < this.list.length; ++i) {
if (index == i) {
this.list[i].open = !this.list[i].open;
} else {
this.list[i].open = false;
}
}
},
goDetailPage(e : Page) {
if (e.function != null) {
const funName = e.function
switch (funName) {
case 'testTimer':
this.testTimer()
break
case 'testInterval':
this.testInterval()
break
case 'testClearInterval':
this.testClearInterval()
break
case 'testMetaRead':
this.testMetaRead()
break
case 'testQuitApp':
this.testQuitApp()
break
}
return
}
uni.navigateTo({
url: `/pages/${e.url}`
})
},
/**
* 测试延迟任务
*/
testTimer: function() {
testTimer: function () {
doTimerTask({
start: function(response) {
start: function (response) {
uni.showToast({
title: response,
icon: 'none'
});
},
work: function(response) {
work: function (response) {
uni.showToast({
title: response,
icon: 'none'
});
},
});
} as TimerOptions);
},
/**
* 测试周期任务
*/
testInterval: function() {
testInterval: function () {
var ret = doIntervalTask({
start: function(response) {
start: function (response) {
uni.showToast({
title: response,
icon: 'none'
});
},
work: function(response) {
work: function (response) {
uni.showToast({
title: response,
icon: 'none'
});
},
});
this.taskId = ret.taskId;
} as TimerOptions);
if (ret.taskId != null) {
this.taskId = ret.taskId!;
}
},
/**
* 取消周期任务
*/
testClearInterval: function() {
testClearInterval: function () {
console.log(this.taskId);
clearIntervalTask(this.taskId);
},
/**
* 跳转至资源加载演示界面
*/
gotoResourceDemo: function() {
uni.navigateTo({
url: '/pages/resource/resource'
})
},
gotoDecorView: function() {
uni.navigateTo({
url: '/pages/advance/android/decorview'
})
},
testAssetLoad() {
// playAssetAudio();
uni.navigateTo({
url: '/pages/advance/android/assetaudio'
})
},
testInputDialog() {
getUserInput(function(res){
console.log(res);
});
},
testQuitApp(){
// testInputDialog() {
// getUserInput(function (res) {
// console.log(res);
// });
// },
testQuitApp() {
quitApp()
},
testMetaRead() {
let ret = getMetaConfig();
uni.showToast({
icon:"none",
icon: "none",
title: '读取成功,注意查看控制台输出'
});
console.log(ret);
},
testLifecyle: function() {
uni.navigateTo({
url: '/pages/lifecycle/lifecycle'
})
},
testHelloUTSComponent: function() {
uni.navigateTo({
url: '/pages/component/helloView'
})
},
testSyntax: function() {
uni.navigateTo({
url: '/pages/SyntaxCase/index'
})
},
testParams: function() {
uni.navigateTo({
url: '/pages/SyntaxCase/paramTest'
})
},
testConsole: function() {
uni.navigateTo({
url: '/pages/SyntaxCase/consoleTest'
})
},
testGetResourcePath: function() {
uni.navigateTo({
url: '/pages/advance/iOS/getResourcePath'
})
}
}
......@@ -209,5 +243,5 @@
</script>
<style>
@import '@/common/uni-uvue.css';
</style>
\ No newline at end of file
<template>
<view>
<page-head :title="title" accordion></page-head>
<uni-collapse accordion>
<uni-collapse-item title="延迟任务" :border="false">
<uni-list>
<uni-list-item @tap="testTimer" title="开启延迟任务" :clickable="true">
</uni-list-item>
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="定时任务" :border="false">
<uni-list>
<uni-list-item @tap="testInterval" title="开启定时任务" :clickable="true">
</uni-list-item>
<uni-list-item @tap="testClearInterval" title="关闭定时任务" :clickable="true">
</uni-list-item>
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="语法示例" :border="false">
<uni-list>
<uni-list-item @tap="testSyntax" title="进阶语法示例" :clickable="true" link>
</uni-list-item>
<uni-list-item @tap="testParams" title="参数传递示例" :clickable="true" link>
</uni-list-item>
<uni-list-item @tap="testConsole" title="日志打印示例" :clickable="true" link>
</uni-list-item>
<uni-list-item @tap="testInstance" title="实例测试示例" :clickable="true" link>
</uni-list-item>
<uni-list-item @tap="testGrammar" title="基础语法测试例" :clickable="true" link>
</uni-list-item>
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="资源加载示例" :border="false">
<uni-list>
<uni-list-item @tap="gotoResourceDemo" title="图片加载示例" :clickable="true" link>
</uni-list-item>
<uni-list-item @tap="gotoFileReadDemo" title="文件读取示例" :clickable="true" link>
</uni-list-item>
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="组件开发示例" :border="false">
<uni-list>
<uni-list-item @tap="testHelloUTSComponent" title="Hello UTS Component" :clickable="true" link />
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="android平台示例" :border="false">
<uni-list>
<uni-list-item @tap="testLifecyle" title="activity生命周期监听" :clickable="true" link />
<uni-list-item @tap="testAssetLoad" title="播放asset音频(需自定义基座)" :clickable="true" link/>
<uni-list-item @tap="gotoDecorView" title="操作DecorView" :clickable="true" link />
<uni-list-item @tap="testMetaRead" title="读取meta配置" :clickable="true" />
<uni-list-item @tap="testQuitApp" title="退出当前应用" :clickable="true" />
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="iOS平台示例" :border="false">
<uni-list>
<uni-list-item @tap="testGetResourcePath" title="资源路径获取示例" :clickable="true" link />
</uni-list>
</uni-collapse-item>
</uni-collapse>
<view class="uni-container">
<page-head :title="title"></page-head>
<view class="uni-panel" v-for="(item, index) in list" :key="index">
<view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="triggerCollapse(index, item)">
<text class="uni-panel-text">{{item.name}}</text>
<image :src="item.pages.length > 0 ? item.open ? arrowUpIcon : arrowDownIcon : arrowRightIcon"
class="uni-icon"></image>
</view>
<view class="uni-panel-c" v-if="item.open">
<view class="uni-navigate-item" v-for="(page,key) in item.pages" :key="key" @click="goDetailPage(page)" hover-class="uni-navigate-item-active">
<text class="uni-navigate-text">{{page.name}}</text>
<image :src="arrowRightIcon" class="uni-icon" v-if="page.url"></image>
</view>
</view>
</view>
</view>
</template>
<script>
......@@ -84,16 +27,123 @@
quitApp
} from "../../uni_modules/uts-advance";
export default {
data() {
return {
title: 'UTS进阶示例',
taskId: 0,
list: [{
name: "延迟任务",
open: false,
pages: [{
name: "开启延迟任务",
function: "testTimer"
}]
},
{
name: "定时任务",
open: false,
pages: [{
name: "开启定时任务",
function: "testInterval"
}, {
name: "关闭定时任务",
function: "testClearInterval"
}]
},
{
name: "语法示例",
open: false,
pages: [{
name: "进阶语法示例",
url: "SyntaxCase/index"
}, {
name: "参数传递示例",
url: "SyntaxCase/paramTest"
}, {
name: "日志打印示例",
url: "SyntaxCase/consoleTest"
},{
name: "实例测试示例",
url: "SyntaxCase/instanceTest"
}, {
name: "基础语法测试例",
url: "SyntaxCase/basicTest"
}]
},
{
name: "资源加载示例",
open: false,
pages: [{
name: "图片加载示例",
url: "resource/resource"
},{
name: "文件读取示例",
url: "resource/fileRead"
}]
},
{
name: "组件开发示例",
open: false,
pages: [{
name: "Hello UTS Component",
url: "component/helloView"
}]
},
{
name: "android平台示例",
open: false,
pages: [{
name: "activity生命周期监听",
url: "lifecycle/lifecycle"
}, {
name: "播放asset音频(需自定义基座)",
url: "advance/android/assetaudio"
}, {
name: "操作DecorView",
url: "advance/android/decorview"
}, {
name: "读取meta配置",
function: "testMetaRead"
}, {
name: "退出当前应用",
function: "testQuitApp"
}]
},
{
name: "iOS平台示例",
open: false,
pages: [{
name: "资源路径获取示例",
url: "advance/iOS/getResourcePath"
}]
},
],
arrowUpIcon: '/static/icons/arrow-up.png',
arrowDownIcon: '/static/icons/arrow-down.png',
arrowRightIcon: '/static/icons/arrow-right.png',
}
},
methods: {
triggerCollapse(index) {
for (var i = 0; i < this.list.length; ++i) {
if (index == i) {
this.list[i].open = !this.list[i].open;
} else {
this.list[i].open = false;
}
}
},
goDetailPage(e) {
if (e.function) {
this[e.function]()
return
}
uni.navigateTo({
url: `/pages/${e.url}`
})
},
/**
* 测试延迟任务
......@@ -141,88 +191,21 @@
console.log(this.taskId);
clearIntervalTask(this.taskId);
},
/**
* 跳转至资源加载演示界面
*/
gotoResourceDemo: function() {
uni.navigateTo({
url: '/pages/resource/resource'
})
},
gotoFileReadDemo: function() {
uni.navigateTo({
url: '/pages/resource/fileRead'
})
},
gotoDecorView: function() {
uni.navigateTo({
url: '/pages/advance/android/decorview'
})
},
testAssetLoad() {
// playAssetAudio();
uni.navigateTo({
url: '/pages/advance/android/assetaudio'
})
},
testInputDialog() {
getUserInput(function(res){
getUserInput(function(res) {
console.log(res);
});
},
testQuitApp(){
testQuitApp() {
quitApp()
},
testMetaRead() {
let ret = getMetaConfig();
uni.showToast({
icon:"none",
icon: "none",
title: '读取成功,注意查看控制台输出'
});
console.log(ret);
},
testLifecyle: function() {
uni.navigateTo({
url: '/pages/lifecycle/lifecycle'
})
},
testHelloUTSComponent: function() {
uni.navigateTo({
url: '/pages/component/helloView'
})
},
testSyntax: function() {
uni.navigateTo({
url: '/pages/SyntaxCase/index'
})
},
testParams: function() {
uni.navigateTo({
url: '/pages/SyntaxCase/paramTest'
})
},
testConsole: function() {
uni.navigateTo({
url: '/pages/SyntaxCase/consoleTest'
})
},
testGrammar: function() {
uni.navigateTo({
url: '/pages/test/index'
})
},
testInstance: function() {
uni.navigateTo({
url: '/pages/SyntaxCase/instanceTest'
})
},
testGetResourcePath: function() {
uni.navigateTo({
url: '/pages/advance/iOS/getResourcePath'
})
}
}
......@@ -230,5 +213,9 @@
</script>
<style>
@import '@/common/uni-uvue.css';
.uni-container {
min-height: 100%;
}
</style>
\ No newline at end of file
......@@ -2,10 +2,8 @@
<view>
<page-head title="asset 音频播放示例" accordion></page-head>
<uni-list>
<uni-list-item title="播放asset音频" :clickable="true" @tap="testStart"></uni-list-item>
<uni-list-item title="停止播放asset音频" :clickable="true" @tap="testStop"></uni-list-item>
</uni-list>
<button @click="testStart">播放asset音频</button>
<button @click="testStop">停止播放asset音频</button>
</view>
</template>
......
......@@ -2,10 +2,8 @@
<view>
<page-head title="asset 音频播放示例" accordion></page-head>
<uni-list>
<uni-list-item title="播放asset音频" :clickable="true" @tap="testStart"></uni-list-item>
<uni-list-item title="停止播放asset音频" :clickable="true" @tap="testStop"></uni-list-item>
</uni-list>
<button @click="testStart">播放asset音频</button>
<button @click="testStop">停止播放asset音频</button>
</view>
</template>
......
......@@ -2,10 +2,8 @@
<view>
<page-head title="DecorView示例" accordion></page-head>
<uni-list>
<uni-list-item title="添加TextView至视图顶层" :clickable="true" @tap="testAddToDecorView"></uni-list-item>
<uni-list-item title="移除视图顶层的TextView" :clickable="true" @tap="testRemoveToDecorView"></uni-list-item>
</uni-list>
<button @click="testAddToDecorView">添加TextView至视图顶层</button>
<button @click="testRemoveToDecorView">移除视图顶层的TextView</button>
</view>
</template>
......
......@@ -2,10 +2,8 @@
<view>
<page-head title="DecorView示例" accordion></page-head>
<uni-list>
<uni-list-item title="添加TextView至视图顶层" :clickable="true" @tap="testAddToDecorView"></uni-list-item>
<uni-list-item title="移除视图顶层的TextView" :clickable="true" @tap="testRemoveToDecorView"></uni-list-item>
</uni-list>
<button @click="testAddToDecorView">添加TextView至视图顶层</button>
<button @click="testRemoveToDecorView">移除视图顶层的TextView</button>
</view>
</template>
......
......@@ -5,16 +5,16 @@
</view>
</template>
<script>
import { getResourcePath } from '@/uni_modules/uts-advance'
import { removeExampleImageView } from '@/uni_modules/uts-advance'
// import { getResourcePath } from '@/uni_modules/uts-advance'
// import { removeExampleImageView } from '@/uni_modules/uts-advance'
export default {
onUnload() {
removeExampleImageView()
// removeExampleImageView()
},
methods:{
getResourcePath(){
getResourcePath("/static/logo.png")
// getResourcePath("/static/logo.png")
}
}
}
......
<template>
<div>
<view>
<uts-hello-view buttonText="点击按钮内容" style="width:375px;height: 375px;background-color: aqua;"></uts-hello-view>
<uts-hello-container>
<text>文本组件</text>
<image src="../../static/logo.png" mode="aspectFit"></image>
</uts-hello-container>
</div>
</view>
</template>
......
......@@ -10,13 +10,13 @@
</view>
</template>
<script>
import * as UTSHello from "../../uni_modules/uts-helloworld";
import { callWithJSONParam, callWithStringParam, callWithoutParam, JsonParamOptions, inputJSON } from "../../uni_modules/uts-helloworld";
export default {
data() {
return {
title: 'UTS入门示例',
stringParam:"hello world",
stringParam: "hello world",
}
},
......@@ -27,11 +27,11 @@
*/
testDoSthWithCallback: function () {
UTSHello.callWithoutParam(
()=>{
callWithoutParam(
() => {
uni.showToast({
title:'成功调用uts插件uts-helloworld的callWithoutParam',
icon:'none'
title: '成功调用uts插件uts-helloworld的callWithoutParam',
icon: 'none'
});
}
);
......@@ -41,12 +41,12 @@
*/
testDoSthWithString: function () {
UTSHello.callWithStringParam(
callWithStringParam(
this.stringParam,
function(response){
function (response) {
uni.showToast({
title:'uts插件uts-helloworld的callWithStringParam方法收到了你输入的字符串:'+response,
icon:'none'
title: 'uts插件uts-helloworld的callWithStringParam方法收到了你输入的字符串:' + response,
icon: 'none'
});
},
);
......@@ -55,20 +55,21 @@
* 测试json参数回调
*/
testDoSthWithJSON: function () {
var inputObject = {
inputText:this.stringParam,
errCode:0
const that = this
var inputObject : inputJSON = {
inputText: that.stringParam,
errCode: 0
}
UTSHello.callWithJSONParam({
input:inputObject,
success:function(response){
callWithJSONParam({
input: inputObject,
success: function (response) {
uni.showToast({
title:'执行结果:' + JSON.stringify(response),
icon:'none'
title: '执行结果:' + JSON.stringify(response),
icon: 'none'
});
}
});
} as JsonParamOptions);
},
}
......
......@@ -10,7 +10,7 @@
</view>
</template>
<script>
import * as UTSHello from "../../uni_modules/uts-helloworld";
import { callWithJSONParam, callWithStringParam, callWithoutParam } from "../../uni_modules/uts-helloworld";
export default {
data() {
......@@ -27,7 +27,7 @@
*/
testDoSthWithCallback: function () {
UTSHello.callWithoutParam(
callWithoutParam(
()=>{
uni.showToast({
title:'成功调用uts插件uts-helloworld的callWithoutParam',
......@@ -41,7 +41,7 @@
*/
testDoSthWithString: function () {
UTSHello.callWithStringParam(
callWithStringParam(
this.stringParam,
function(response){
uni.showToast({
......@@ -60,7 +60,7 @@
errCode:0
}
UTSHello.callWithJSONParam({
callWithJSONParam({
input:inputObject,
success:function(response){
uni.showToast({
......
......@@ -34,8 +34,8 @@
let that = this;
initAppLifecycle(function(eventLog){
// 展示捕捉到的声明周期日志
that.text = that.text += eventLog;
that.text = that.text += '\n';
that.text += eventLog;
that.text += '\n';
});
},
methods:{
......
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-btn-v uni-common-mt">
<button type="primary" @tap="getImageBase64">读取图片base64</button>
<button type="primary" @tap="getFileText">读取文本内容</button>
</view>
</view>
</template>
<script>
import { readFile,writeFile, ReadFileOptions, WriteFileOptions } from '../../uni_modules/uts-file-manager'
export default {
data() {
return {
title: '文件读取示例',
logo:""
}
},
methods: {
getImageBase64:function(){
readFile({
type:'base64',
path:'static/logo.png',
success:function(res){
console.log("success")
console.log(res)
},
fail:function(res){
console.log('fail')
console.log(res)
},
complete:function(res){
console.log("complete")
console.log(res)
}
} as ReadFileOptions)
},
getFileText:function(){
writeFile({
path:'/test/1.txt',
content:'锄禾日当午,汗滴禾下土,谁知盘中餐,粒粒皆辛苦',
success:function(res){
readFile({
type:'text',
path:res.filePath,
success:function(res){
console.log("success")
console.log(res)
},
fail:function(res){
console.log('fail')
console.log(res)
},
complete:function(res){
console.log("complete")
console.log(res)
}
} as ReadFileOptions)
},
fail:function(res){
console.log('fail')
console.log(res)
},
complete:function(res){
console.log("complete")
console.log(res)
}
} as WriteFileOptions)
}
}
}
</script>
<style>
</style>
## 1.2.1(2022-09-05)
- 修复 当 text 超过 max-num 时,badge 的宽度计算是根据 text 的长度计算,更改为 css 计算实际展示宽度,详见:[https://ask.dcloud.net.cn/question/150473](https://ask.dcloud.net.cn/question/150473)
## 1.2.0(2021-11-19)
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-badge](https://uniapp.dcloud.io/component/uniui/uni-badge)
## 1.1.7(2021-11-08)
- 优化 升级ui
- 修改 size 属性默认值调整为 small
- 修改 type 属性,默认值调整为 error,info 替换 default
## 1.1.6(2021-09-22)
- 修复 在字节小程序上样式不生效的 bug
## 1.1.5(2021-07-30)
- 组件兼容 vue3,如何创建vue3项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.4(2021-07-29)
- 修复 去掉 nvue 不支持css 的 align-self 属性,nvue 下不暂支持 absolute 属性
## 1.1.3(2021-06-24)
- 优化 示例项目
## 1.1.1(2021-05-12)
- 新增 组件示例地址
## 1.1.0(2021-05-12)
- 新增 uni-badge 的 absolute 属性,支持定位
- 新增 uni-badge 的 offset 属性,支持定位偏移
- 新增 uni-badge 的 is-dot 属性,支持仅显示有一个小点
- 新增 uni-badge 的 max-num 属性,支持自定义封顶的数字值,超过 99 显示99+
- 优化 uni-badge 属性 custom-style, 支持以对象形式自定义样式
## 1.0.7(2021-05-07)
- 修复 uni-badge 在 App 端,数字小于10时不是圆形的bug
- 修复 uni-badge 在父元素不是 flex 布局时,宽度缩小的bug
- 新增 uni-badge 属性 custom-style, 支持自定义样式
## 1.0.6(2021-02-04)
- 调整为uni_modules目录规范
<template>
<view class="uni-badge--x">
<slot />
<text v-if="text" :class="classNames" :style="[positionStyle, customStyle, dotStyle]"
class="uni-badge" @click="onClick()">{{displayValue}}</text>
</view>
</template>
<script>
/**
* Badge 数字角标
* @description 数字角标一般和其它控件(列表、9宫格等)配合使用,用于进行数量提示,默认为实心灰色背景
* @tutorial https://ext.dcloud.net.cn/plugin?id=21
* @property {String} text 角标内容
* @property {String} size = [normal|small] 角标内容
* @property {String} type = [info|primary|success|warning|error] 颜色类型
* @value info 灰色
* @value primary 蓝色
* @value success 绿色
* @value warning 黄色
* @value error 红色
* @property {String} inverted = [true|false] 是否无需背景颜色
* @property {Number} maxNum 展示封顶的数字值,超过 99 显示 99+
* @property {String} absolute = [rightTop|rightBottom|leftBottom|leftTop] 开启绝对定位, 角标将定位到其包裹的标签的四角上
* @value rightTop 右上
* @value rightBottom 右下
* @value leftTop 左上
* @value leftBottom 左下
* @property {Array[number]} offset 距定位角中心点的偏移量,只有存在 absolute 属性时有效,例如:[-10, -10] 表示向外偏移 10px,[10, 10] 表示向 absolute 指定的内偏移 10px
* @property {String} isDot = [true|false] 是否显示为一个小点
* @event {Function} click 点击 Badge 触发事件
* @example <uni-badge text="1"></uni-badge>
*/
export default {
name: 'UniBadge',
emits: ['click'],
props: {
type: {
type: String,
default: 'error'
},
inverted: {
type: Boolean,
default: false
},
isDot: {
type: Boolean,
default: false
},
maxNum: {
type: Number,
default: 99
},
absolute: {
type: String,
default: ''
},
offset: {
type: Array,
default () {
return [0, 0]
}
},
text: {
type: [String, Number],
default: ''
},
size: {
type: String,
default: 'small'
},
customStyle: {
type: Object,
default () {
return {}
}
}
},
data() {
return {};
},
computed: {
width() {
return String(this.text).length * 8 + 12
},
classNames() {
const {
inverted,
type,
size,
absolute
} = this
return [
inverted ? 'uni-badge--' + type + '-inverted' : '',
'uni-badge--' + type,
'uni-badge--' + size,
absolute ? 'uni-badge--absolute' : ''
].join(' ')
},
positionStyle() {
if (!this.absolute) return {}
let w = this.width / 2,
h = 10
if (this.isDot) {
w = 5
h = 5
}
const x = `${- w + this.offset[0]}px`
const y = `${- h + this.offset[1]}px`
const whiteList = {
rightTop: {
right: x,
top: y
},
rightBottom: {
right: x,
bottom: y
},
leftBottom: {
left: x,
bottom: y
},
leftTop: {
left: x,
top: y
}
}
const match = whiteList[this.absolute]
return match ? match : whiteList['rightTop']
},
dotStyle() {
if (!this.isDot) return {}
return {
width: '10px',
minWidth: '0',
height: '10px',
padding: '0',
borderRadius: '10px'
}
},
displayValue() {
const {
isDot,
text,
maxNum
} = this
return isDot ? '' : (Number(text) > maxNum ? `${maxNum}+` : text)
}
},
methods: {
onClick() {
this.$emit('click');
}
}
};
</script>
<style lang="scss" >
$uni-primary: #2979ff !default;
$uni-success: #4cd964 !default;
$uni-warning: #f0ad4e !default;
$uni-error: #dd524d !default;
$uni-info: #909399 !default;
$bage-size: 12px;
$bage-small: scale(0.8);
.uni-badge--x {
/* #ifdef APP-NVUE */
// align-self: flex-start;
/* #endif */
/* #ifndef APP-NVUE */
display: inline-block;
/* #endif */
position: relative;
}
.uni-badge--absolute {
position: absolute;
}
.uni-badge--small {
transform: $bage-small;
transform-origin: center center;
}
.uni-badge {
/* #ifndef APP-NVUE */
display: flex;
overflow: hidden;
box-sizing: border-box;
/* #endif */
justify-content: center;
flex-direction: row;
height: 20px;
min-width: 20px;
padding: 0 4px;
line-height: 18px;
color: #fff;
border-radius: 100px;
background-color: $uni-info;
background-color: transparent;
border: 1px solid #fff;
text-align: center;
font-family: 'Helvetica Neue', Helvetica, sans-serif;
font-feature-settings: "tnum";
font-size: $bage-size;
/* #ifdef H5 */
z-index: 999;
cursor: pointer;
/* #endif */
&--info {
color: #fff;
background-color: $uni-info;
}
&--primary {
background-color: $uni-primary;
}
&--success {
background-color: $uni-success;
}
&--warning {
background-color: $uni-warning;
}
&--error {
background-color: $uni-error;
}
&--inverted {
padding: 0 5px 0 0;
color: $uni-info;
}
&--info-inverted {
color: $uni-info;
background-color: transparent;
}
&--primary-inverted {
color: $uni-primary;
background-color: transparent;
}
&--success-inverted {
color: $uni-success;
background-color: transparent;
}
&--warning-inverted {
color: $uni-warning;
background-color: transparent;
}
&--error-inverted {
color: $uni-error;
background-color: transparent;
}
}
</style>
{
"id": "uni-badge",
"displayName": "uni-badge 数字角标",
"version": "1.2.1",
"description": "数字角标(徽章)组件,在元素周围展示消息提醒,一般用于列表、九宫格、按钮等地方。",
"keywords": [
"",
"badge",
"uni-ui",
"uniui",
"数字角标",
"徽章"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "y",
"联盟": "y"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}
\ No newline at end of file
## Badge 数字角标
> **组件名:uni-badge**
> 代码块: `uBadge`
数字角标一般和其它控件(列表、9宫格等)配合使用,用于进行数量提示,默认为实心灰色背景,
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-badge)
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839
## 1.4.3(2022-01-25)
- 修复 初始化的时候 ,open 属性失效的bug
## 1.4.2(2022-01-21)
- 修复 微信小程序resize后组件收起的bug
## 1.4.1(2021-11-22)
- 修复 vue3中个别scss变量无法找到的问题
## 1.4.0(2021-11-19)
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-collapse](https://uniapp.dcloud.io/component/uniui/uni-collapse)
## 1.3.3(2021-08-17)
- 优化 show-arrow 属性默认为true
## 1.3.2(2021-08-17)
- 新增 show-arrow 属性,控制是否显示右侧箭头
## 1.3.1(2021-07-30)
- 优化 vue3下小程序事件警告的问题
## 1.3.0(2021-07-30)
- 组件兼容 vue3,如何创建vue3项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.2.2(2021-07-21)
- 修复 由1.2.0版本引起的 change 事件返回 undefined 的Bug
## 1.2.1(2021-07-21)
- 优化 组件示例
## 1.2.0(2021-07-21)
- 新增 组件折叠动画
- 新增 value\v-model 属性 ,动态修改面板折叠状态
- 新增 title 插槽 ,可定义面板标题
- 新增 border 属性 ,显示隐藏面板内容分隔线
- 新增 title-border 属性 ,显示隐藏面板标题分隔线
- 修复 resize 方法失效的Bug
- 修复 change 事件返回参数不正确的Bug
- 优化 H5、App 平台自动更具内容更新高度,无需调用 reszie() 方法
## 1.1.7(2021-05-12)
- 新增 组件示例地址
## 1.1.6(2021-02-05)
- 优化 组件引用关系,通过uni_modules引用组件
## 1.1.5(2021-02-05)
- 调整为uni_modules目录规范
\ No newline at end of file
<template>
<view class="uni-collapse">
<slot />
</view>
</template>
<script>
/**
* Collapse 折叠面板
* @description 展示可以折叠 / 展开的内容区域
* @tutorial https://ext.dcloud.net.cn/plugin?id=23
* @property {String|Array} value 当前激活面板改变时触发(如果是手风琴模式,参数类型为string,否则为array)
* @property {Boolean} accordion = [true|false] 是否开启手风琴效果是否开启手风琴效果
* @event {Function} change 切换面板时触发,如果是手风琴模式,返回类型为string,否则为array
*/
export default {
name: 'uniCollapse',
emits:['change','activeItem','input','update:modelValue'],
props: {
value: {
type: [String, Array],
default: ''
},
modelValue: {
type: [String, Array],
default: ''
},
accordion: {
// 是否开启手风琴效果
type: [Boolean, String],
default: false
},
},
data() {
return {}
},
computed: {
// TODO 兼容 vue2 和 vue3
dataValue() {
let value = (typeof this.value === 'string' && this.value === '') ||
(Array.isArray(this.value) && this.value.length === 0)
let modelValue = (typeof this.modelValue === 'string' && this.modelValue === '') ||
(Array.isArray(this.modelValue) && this.modelValue.length === 0)
if (value) {
return this.modelValue
}
if (modelValue) {
return this.value
}
return this.value
}
},
watch: {
dataValue(val) {
this.setOpen(val)
}
},
created() {
this.childrens = []
this.names = []
},
mounted() {
this.$nextTick(()=>{
this.setOpen(this.dataValue)
})
},
methods: {
setOpen(val) {
let str = typeof val === 'string'
let arr = Array.isArray(val)
this.childrens.forEach((vm, index) => {
if (str) {
if (val === vm.nameSync) {
if (!this.accordion) {
console.warn('accordion 属性为 false ,v-model 类型应该为 array')
return
}
vm.isOpen = true
}
}
if (arr) {
val.forEach(v => {
if (v === vm.nameSync) {
if (this.accordion) {
console.warn('accordion 属性为 true ,v-model 类型应该为 string')
return
}
vm.isOpen = true
}
})
}
})
this.emit(val)
},
setAccordion(self) {
if (!this.accordion) return
this.childrens.forEach((vm, index) => {
if (self !== vm) {
vm.isOpen = false
}
})
},
resize() {
this.childrens.forEach((vm, index) => {
// #ifndef APP-NVUE
vm.getCollapseHeight()
// #endif
// #ifdef APP-NVUE
vm.getNvueHwight()
// #endif
})
},
onChange(isOpen, self) {
let activeItem = []
if (this.accordion) {
activeItem = isOpen ? self.nameSync : ''
} else {
this.childrens.forEach((vm, index) => {
if (vm.isOpen) {
activeItem.push(vm.nameSync)
}
})
}
this.$emit('change', activeItem)
this.emit(activeItem)
},
emit(val){
this.$emit('input', val)
this.$emit('update:modelValue', val)
}
}
}
</script>
<style lang="scss" >
.uni-collapse {
/* #ifndef APP-NVUE */
width: 100%;
display: flex;
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
flex-direction: column;
background-color: #fff;
}
</style>
{
"id": "uni-collapse",
"displayName": "uni-collapse 折叠面板",
"version": "1.4.3",
"description": "Collapse 组件,可以折叠 / 展开的内容区域。",
"keywords": [
"uni-ui",
"折叠",
"折叠面板",
"手风琴"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": [
"uni-scss",
"uni-icons"
],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}
## Collapse 折叠面板
> **组件名:uni-collapse**
> 代码块: `uCollapse`
> 关联组件:`uni-collapse-item`、`uni-icons`。
折叠面板用来折叠/显示过长的内容或者是列表。通常是在多内容分类项使用,折叠不重要的内容,显示重要内容。点击可以展开折叠部分。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-collapse)
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839
\ No newline at end of file
## 1.3.5(2022-01-24)
- 优化 size 属性可以传入不带单位的字符串数值
## 1.3.4(2022-01-24)
- 优化 size 支持其他单位
## 1.3.3(2022-01-17)
- 修复 nvue 有些图标不显示的bug,兼容老版本图标
## 1.3.2(2021-12-01)
- 优化 示例可复制图标名称
## 1.3.1(2021-11-23)
- 优化 兼容旧组件 type 值
## 1.3.0(2021-11-19)
- 新增 更多图标
- 优化 自定义图标使用方式
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-icons](https://uniapp.dcloud.io/component/uniui/uni-icons)
## 1.1.7(2021-11-08)
## 1.2.0(2021-07-30)
- 组件兼容 vue3,如何创建vue3项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.5(2021-05-12)
- 新增 组件示例地址
## 1.1.4(2021-02-05)
- 调整为uni_modules目录规范
{
"id": "uni-icons",
"displayName": "uni-icons 图标",
"version": "1.3.5",
"description": "图标组件,用于展示移动端常见的图标,可自定义颜色、大小。",
"keywords": [
"uni-ui",
"uniui",
"icon",
"图标"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": "^3.2.14"
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}
\ No newline at end of file
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册