提交 ed221f2c 编写于 作者: fxy060608's avatar fxy060608

重构进阶语法示例,同时支持vue2,vue3

上级 1de30723
<template> <template>
<button @click="testUtsSync">点击测试uts同步方法</button> <view>
<view>测试return: <button @click="testUtsSync">点击测试uts同步方法</button>
{{ format(testUtsSyncResult) }} <view>测试return:
</view> {{ format(testUtsSyncResult) }}
<button @click="testUtsSyncWithCallback"> </view>
点击测试uts带callback的同步方法 <button @click="testUtsSyncWithCallback">
</button> 点击测试uts带callback的同步方法
<view>测试return:{{ format(testUtsSyncWithCallbackResult.return) }}</view> </button>
<view>测试success:{{ format(testUtsSyncWithCallbackResult.success) }}</view> <view>测试return:{{ format(testUtsSyncWithCallbackResult.return) }}</view>
<view>测试complete:{{ format(testUtsSyncWithCallbackResult.complete) }}</view> <view>测试success:{{ format(testUtsSyncWithCallbackResult.success) }}</view>
<button @click="testUtsAsync">点击测试uts异步方法</button> <view>测试complete:{{ format(testUtsSyncWithCallbackResult.complete) }}</view>
<view>测试return:{{ format(testUtsAsyncResult.return) }}</view> <button @click="testUtsAsync">点击测试uts异步方法</button>
<view>测试success:{{ format(testUtsAsyncResult.success) }}</view> <view>测试return:{{ format(testUtsAsyncResult.return) }}</view>
<view>测试complete:{{ format(testUtsAsyncResult.complete) }}</view> <view>测试success:{{ format(testUtsAsyncResult.success) }}</view>
<button @click="testUtsClassConstructor">点击测试uts class构造函数</button> <view>测试complete:{{ format(testUtsAsyncResult.complete) }}</view>
<view>测试callback:{{ format(testUtsClassConstructorResult.callback) }}</view> <button @click="testUtsClassConstructor">点击测试uts class构造函数</button>
<button @click="testUtsClassStaticProp">点击测试uts class静态属性</button> <view>测试callback:{{ format(testUtsClassConstructorResult.callback) }}</view>
<view>测试value:{{ format(testUtsClassStaticPropResult) }}</view> <button @click="testUtsClassStaticProp">点击测试uts class静态属性</button>
<button @click="testUtsClassStaticSyncWithCallback"> <view>测试value:{{ format(testUtsClassStaticPropResult) }}</view>
点击测试uts class静态方法 <button @click="testUtsClassStaticSyncWithCallback">
</button> 点击测试uts class静态方法
<view>测试return:{{ format(testUtsClassStaticSyncWithCallbackResult.return) }}</view> </button>
<view>测试success:{{ format(testUtsClassStaticSyncWithCallbackResult.success) }}</view> <view>测试return:{{ format(testUtsClassStaticSyncWithCallbackResult.return) }}</view>
<view>测试complete:{{ format(testUtsClassStaticSyncWithCallbackResult.complete) }}</view> <view>测试success:{{ format(testUtsClassStaticSyncWithCallbackResult.success) }}</view>
<button @click="testUtsClassStaticAsync">点击测试uts class静态异步方法</button> <view>测试complete:{{ format(testUtsClassStaticSyncWithCallbackResult.complete) }}</view>
<view>测试return:{{ format(testUtsClassStaticAsyncResult.return) }}</view> <button @click="testUtsClassStaticAsync">点击测试uts class静态异步方法</button>
<view>测试success:{{ format(testUtsClassStaticAsyncResult.success) }}</view> <view>测试return:{{ format(testUtsClassStaticAsyncResult.return) }}</view>
<view>测试complete:{{ format(testUtsClassStaticAsyncResult.complete) }}</view> <view>测试success:{{ format(testUtsClassStaticAsyncResult.success) }}</view>
<button @click="testUtsClassProp">点击测试uts class实例属性</button> <view>测试complete:{{ format(testUtsClassStaticAsyncResult.complete) }}</view>
<view>测试value:{{ format(testUtsClassPropResult) }}</view> <button @click="testUtsClassProp">点击测试uts class实例属性</button>
<button @click="testUtsClassSyncWithCallback"> <view>测试value:{{ format(testUtsClassPropResult) }}</view>
点击测试uts class实例方法 <button @click="testUtsClassSyncWithCallback">
</button> 点击测试uts class实例方法
<view>测试return:{{ format(testUtsClassSyncWithCallbackResult.return) }}</view> </button>
<view>测试success:{{ format(testUtsClassSyncWithCallbackResult.success) }}</view> <view>测试return:{{ format(testUtsClassSyncWithCallbackResult.return) }}</view>
<view>测试complete:{{ format(testUtsClassSyncWithCallbackResult.complete) }}</view> <view>测试success:{{ format(testUtsClassSyncWithCallbackResult.success) }}</view>
<button @click="testUtsClassAsync">点击测试uts class实例异步方法</button> <view>测试complete:{{ format(testUtsClassSyncWithCallbackResult.complete) }}</view>
<view>测试return:{{ format(testUtsClassAsyncResult.return) }}</view> <button @click="testUtsClassAsync">点击测试uts class实例异步方法</button>
<view>测试success:{{ format(testUtsClassAsyncResult.success) }}</view> <view>测试return:{{ format(testUtsClassAsyncResult.return) }}</view>
<view>测试complete:{{ format(testUtsClassAsyncResult.complete) }}</view> <view>测试success:{{ format(testUtsClassAsyncResult.success) }}</view>
<button @click="testAll">点击测试所有</button> <view>测试complete:{{ format(testUtsClassAsyncResult.complete) }}</view>
</template> <button @click="testAll">点击测试所有</button>
<script lang="ts" setup> </view>
import { ref, reactive } from "vue"; </template>
import { <script>
MAX, import {
testSync, MAX,
testSyncWithCallback, testSync,
testAsync, testSyncWithCallback,
Test, testAsync,
} from "../../uni_modules/uts-syntaxcase"; Test,
} from "../../uni_modules/uts-syntaxcase";
console.log("MAX", MAX); console.log("MAX", MAX);
const testUtsSyncResult = ref<boolean | null>(null); let test
interface Result { let id = 0
return: boolean | null; export default {
success: boolean | null; data() {
fail: boolean | null; return {
complete: boolean | null; testUtsSyncResult: null,
} testUtsSyncWithCallbackResult: {
const testUtsSyncWithCallbackResult = reactive<Result>({ return: null,
return: null, success: null,
success: null, fail: null,
fail: null, complete: null,
complete: null, },
}); testUtsAsyncResult: {
const testUtsAsyncResult = reactive<Result>({ return: null,
return: null, success: null,
success: null, fail: null,
fail: null, complete: null,
complete: null, },
}); testUtsClassConstructorResult: {
function testAll() { callback: null
testUtsSync(); },
testUtsSyncWithCallback(); testUtsClassStaticPropResult: null,
testUtsAsync(); testUtsClassStaticSyncWithCallbackResult: {
testUtsClassConstructor(); return: null,
testUtsClassStaticProp(); success: null,
testUtsClassStaticSyncWithCallback(); fail: null,
testUtsClassStaticAsync(); complete: null,
testUtsClassProp(); },
testUtsClassSyncWithCallback(); testUtsClassStaticAsyncResult: {
testUtsClassAsync(); return: null,
} success: null,
function testUtsSync() { fail: null,
testUtsSyncResult.value = false; complete: null,
try { },
if (testSync("dcloud").msg === "hello dcloud") { testUtsClassPropResult: null,
testUtsSyncResult.value = true; testUtsClassSyncWithCallbackResult: {
} return: null,
} catch (e) { success: null,
console.error("testUtsSync", e); fail: null,
} complete: null,
} },
function testUtsSyncWithCallback() { testUtsClassAsyncResult: {
try { return: null,
testUtsSyncWithCallbackResult.return = false; success: null,
testUtsSyncWithCallbackResult.success = false; fail: null,
// testUtsSyncWithCallbackResult.fail = false; complete: null,
testUtsSyncWithCallbackResult.complete = false; }
if ( }
testSyncWithCallback({ },
type: "success", methods: {
success(res) { format(v) {
console.log("testSyncWithCallback.success.callback", res); return v == null ? "--" : v ? "通过" : "未通过";
testUtsSyncWithCallbackResult.success = true; },
}, testAll() {
fail(res) { this.testUtsSync();
console.log("testSyncWithCallback.fail.callback", res); this.testUtsSyncWithCallback();
// testUtsSyncWithCallbackResult.fail = true; this.testUtsAsync();
}, this.testUtsClassConstructor();
complete(res) { this.testUtsClassStaticProp();
console.log("testSyncWithCallback.complete.callback", res); this.testUtsClassStaticSyncWithCallback();
testUtsSyncWithCallbackResult.complete = true; this.testUtsClassStaticAsync();
}, this.testUtsClassProp();
}).name === "testSyncWithCallback" this.testUtsClassSyncWithCallback();
) { this.testUtsClassAsync();
testUtsSyncWithCallbackResult.return = true; },
} testUtsSync() {
} catch (e) { } this.testUtsSyncResult = false;
} try {
async function testUtsAsync() { if (testSync("dcloud").msg === "hello dcloud") {
testUtsAsyncResult.return = false; this.testUtsSyncResult = true;
testUtsAsyncResult.success = false; }
// testUtsAsyncResult.fail = false; } catch (e) {
testUtsAsyncResult.complete = false; console.error("testUtsSync", e);
try { }
const res = await testAsync({ },
type: "success", testUtsSyncWithCallback() {
success(res) { try {
console.log("testAsync.success.callback", res); this.testUtsSyncWithCallbackResult.return = false;
testUtsAsyncResult.success = true; this.testUtsSyncWithCallbackResult.success = false;
}, // testUtsSyncWithCallbackResult.fail = false;
fail(res) { this.testUtsSyncWithCallbackResult.complete = false;
console.log("testAsync.fail.callback", res); if (
}, testSyncWithCallback({
complete(res) { type: "success",
console.log("testAsync.complete.callback", res); success: (res) => {
testUtsAsyncResult.complete = true; console.log("testSyncWithCallback.success.callback", res);
}, this.testUtsSyncWithCallbackResult.success = true;
}); },
if (res.name === "testAsync") { fail: (res) => {
testUtsAsyncResult.return = true; console.log("testSyncWithCallback.fail.callback", res);
} // testUtsSyncWithCallbackResult.fail = true;
} catch (e) { } },
} complete: (res) => {
function format(v: boolean | null) { console.log("testSyncWithCallback.complete.callback", res);
return v == null ? "--" : v ? "通过" : "未通过"; this.testUtsSyncWithCallbackResult.complete = true;
} },
let test: Test }).name === "testSyncWithCallback"
let id = 0 ) {
const testUtsClassConstructorResult = reactive<{ callback: boolean | null }>({ this.testUtsSyncWithCallbackResult.return = true;
callback: null }
}); } catch (e) {}
function testUtsClassConstructor() { },
testUtsClassConstructorResult.callback = false async testUtsAsync() {
id++ this.testUtsAsyncResult.return = false;
test = new Test(id, { this.testUtsAsyncResult.success = false;
name: 'name' + id, callback: (res) => { // testUtsAsyncResult.fail = false;
console.log(res) this.testUtsAsyncResult.complete = false;
testUtsClassConstructorResult.callback = true try {
} const res = await testAsync({
}) type: "success",
} success: (res) => {
const testUtsClassStaticPropResult = ref<boolean | null>(null); console.log("testAsync.success.callback", res);
function testUtsClassStaticProp() { this.testUtsAsyncResult.success = true;
testUtsClassStaticPropResult.value = false },
if (Test.type === 'Test') { fail: (res) => {
testUtsClassStaticPropResult.value = true console.log("testAsync.fail.callback", res);
} },
} complete: (res) => {
const testUtsClassStaticSyncWithCallbackResult = reactive<Result>({ console.log("testAsync.complete.callback", res);
return: null, this.testUtsAsyncResult.complete = true;
success: null, },
fail: null, });
complete: null, if (res.name === "testAsync") {
}); this.testUtsAsyncResult.return = true;
function testUtsClassStaticSyncWithCallback() { }
try { } catch (e) {}
testUtsClassStaticSyncWithCallbackResult.return = false; },
testUtsClassStaticSyncWithCallbackResult.success = false; testUtsClassConstructor() {
// testUtsClassStaticSyncWithCallbackResult.fail = false; this.testUtsClassConstructorResult.callback = false
testUtsClassStaticSyncWithCallbackResult.complete = false; id++
if ( test = new Test(id, {
Test.testClassStaticSyncWithCallback({ name: 'name' + id,
type: "success", callback: (res) => {
success(res) { console.log(res)
console.log("testStaticSyncWithCallback.success.callback", res); this.testUtsClassConstructorResult.callback = true
testUtsClassStaticSyncWithCallbackResult.success = true; }
}, })
fail(res) { },
console.log("testStaticSyncWithCallback.fail.callback", res); testUtsClassStaticProp() {
// testUtsClassStaticSyncWithCallbackResult.fail = true; this.testUtsClassStaticPropResult = false
}, if (Test.type === 'Test') {
complete(res) { this.testUtsClassStaticPropResult = true
console.log("testStaticSyncWithCallback.complete.callback", res); }
testUtsClassStaticSyncWithCallbackResult.complete = true; },
}, testUtsClassStaticSyncWithCallback() {
}).name === "testSyncWithCallback" try {
) { this.testUtsClassStaticSyncWithCallbackResult.return = false;
testUtsClassStaticSyncWithCallbackResult.return = true; this.testUtsClassStaticSyncWithCallbackResult.success = false;
} // testUtsClassStaticSyncWithCallbackResult.fail = false;
} catch (e) { } this.testUtsClassStaticSyncWithCallbackResult.complete = false;
} if (
const testUtsClassStaticAsyncResult = reactive<Result>({ Test.testClassStaticSyncWithCallback({
return: null, type: "success",
success: null, success: (res) => {
fail: null, console.log("testStaticSyncWithCallback.success.callback", res);
complete: null, this.testUtsClassStaticSyncWithCallbackResult.success = true;
}); },
async function testUtsClassStaticAsync() { fail: (res) => {
testUtsClassStaticAsyncResult.return = false; console.log("testStaticSyncWithCallback.fail.callback", res);
testUtsClassStaticAsyncResult.success = false; // testUtsClassStaticSyncWithCallbackResult.fail = true;
// testUtsClassStaticAsyncResult.fail = false; },
testUtsClassStaticAsyncResult.complete = false; complete: (res) => {
try { console.log("testStaticSyncWithCallback.complete.callback", res);
const res = await Test.testClassStaticAsync({ this.testUtsClassStaticSyncWithCallbackResult.complete = true;
type: "success", },
success(res) { }).name === "testSyncWithCallback"
console.log("testAsync.success.callback", res); ) {
testUtsClassStaticAsyncResult.success = true; this.testUtsClassStaticSyncWithCallbackResult.return = true;
}, }
fail(res) { } catch (e) {}
console.log("testAsync.fail.callback", res); },
}, async testUtsClassStaticAsync() {
complete(res) { this.testUtsClassStaticAsyncResult.return = false;
console.log("testAsync.complete.callback", res); this.testUtsClassStaticAsyncResult.success = false;
testUtsClassStaticAsyncResult.complete = true; // testUtsClassStaticAsyncResult.fail = false;
}, this.testUtsClassStaticAsyncResult.complete = false;
}); try {
if (res.name === "testAsync") { const res = await Test.testClassStaticAsync({
testUtsClassStaticAsyncResult.return = true; type: "success",
} success: (res) => {
} catch (e) { } console.log("testAsync.success.callback", res);
} this.testUtsClassStaticAsyncResult.success = true;
},
const testUtsClassPropResult = ref<boolean | null>(null); fail: (res) => {
function testUtsClassProp() { console.log("testAsync.fail.callback", res);
if (!test) { },
testUtsClassConstructor() complete: (res) => {
} console.log("testAsync.complete.callback", res);
testUtsClassPropResult.value = false this.testUtsClassStaticAsyncResult.complete = true;
if (test.id > 0) { },
testUtsClassPropResult.value = true });
} if (res.name === "testAsync") {
} this.testUtsClassStaticAsyncResult.return = true;
}
const testUtsClassSyncWithCallbackResult = reactive<Result>({ } catch (e) {}
return: null, },
success: null, testUtsClassProp() {
fail: null, if (!test) {
complete: null, this.testUtsClassConstructor()
}); }
function testUtsClassSyncWithCallback() { this.testUtsClassPropResult = false
if (!test) { if (test.id > 0) {
testUtsClassConstructor() this.testUtsClassPropResult = true
} }
try { },
testUtsClassSyncWithCallbackResult.return = false;
testUtsClassSyncWithCallbackResult.success = false; testUtsClassSyncWithCallback() {
// testUtsClassSyncWithCallbackResult.fail = false; if (!test) {
testUtsClassSyncWithCallbackResult.complete = false; this.testUtsClassConstructor()
if ( }
test.testClassSyncWithCallback({ try {
type: "success", this.testUtsClassSyncWithCallbackResult.return = false;
success(res) { this.testUtsClassSyncWithCallbackResult.success = false;
console.log("testSyncWithCallback.success.callback", res); // testUtsClassSyncWithCallbackResult.fail = false;
testUtsClassSyncWithCallbackResult.success = true; this.testUtsClassSyncWithCallbackResult.complete = false;
}, if (
fail(res) { test.testClassSyncWithCallback({
console.log("testSyncWithCallback.fail.callback", res); type: "success",
// testUtsClassSyncWithCallbackResult.fail = true; success: (res) => {
}, console.log("testSyncWithCallback.success.callback", res);
complete(res) { this.testUtsClassSyncWithCallbackResult.success = true;
console.log("testSyncWithCallback.complete.callback", res); },
testUtsClassSyncWithCallbackResult.complete = true; fail: (res) => {
}, console.log("testSyncWithCallback.fail.callback", res);
}).name === "testSyncWithCallback" // testUtsClassSyncWithCallbackResult.fail = true;
) { },
testUtsClassSyncWithCallbackResult.return = true; complete: (res) => {
} console.log("testSyncWithCallback.complete.callback", res);
} catch (e) { } this.testUtsClassSyncWithCallbackResult.complete = true;
} },
const testUtsClassAsyncResult = reactive<Result>({ }).name === "testSyncWithCallback"
return: null, ) {
success: null, this.testUtsClassSyncWithCallbackResult.return = true;
fail: null, }
complete: null, } catch (e) {}
}); },
async function testUtsClassAsync() {
if (!test) { async testUtsClassAsync() {
testUtsClassConstructor() if (!test) {
} this.testUtsClassConstructor()
testUtsClassAsyncResult.return = false; }
testUtsClassAsyncResult.success = false; this.testUtsClassAsyncResult.return = false;
// testUtsClassAsyncResult.fail = false; this.testUtsClassAsyncResult.success = false;
testUtsClassAsyncResult.complete = false; // testUtsClassAsyncResult.fail = false;
try { this.testUtsClassAsyncResult.complete = false;
const res = await test.testClassAsync({ try {
type: "success", const res = await test.testClassAsync({
success(res) { type: "success",
console.log("testAsync.success.callback", res); success: (res) => {
testUtsClassAsyncResult.success = true; console.log("testAsync.success.callback", res);
}, this.testUtsClassAsyncResult.success = true;
fail(res) { },
console.log("testAsync.fail.callback", res); fail: (res) => {
}, console.log("testAsync.fail.callback", res);
complete(res) { },
console.log("testAsync.complete.callback", res); complete: (res) => {
testUtsClassAsyncResult.complete = true; console.log("testAsync.complete.callback", res);
}, this.testUtsClassAsyncResult.complete = true;
}); },
if (res.name === "testAsync") { });
testUtsClassAsyncResult.return = true; if (res.name === "testAsync") {
} this.testUtsClassAsyncResult.return = true;
} catch (e) { } }
} } catch (e) {}
}
}
}
</script> </script>
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册