提交 1a197182 编写于 作者: shutao-dc's avatar shutao-dc

调整native-view示例组件命名

# Conflicts:
#	pages/component/native-view/native-view.uvue
#	uni_modules/native-button/components/native-button/native-button.uvue
上级 4a39ae6e
<template> <template>
<view> <view>
<native-button class="native-button" style="width: 200px; height: 100px;" :text="buttonText" @buttonTap="ontap" <native-button class="native-button" style="width: 200px; height: 100px;" :text="buttonText" @buttonTap="ontap"
@load="onload"></native-button> @load="onload"></native-button>
<time-picker class="native-time-picker" :hour=2 :minute=3 @changed="onChanged"></time-picker> <native-time-picker class="native-time-picker" :hour=2 :minute=3 @changed="onChanged"></native-time-picker>
</view> </view>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
title: 'Hello', title: 'Hello',
buttonText: "native-button", buttonText: "native-button",
isLoad: false isLoad: false,
} clickCount: 0
}, }
onLoad() { },
onLoad() {
},
methods: { },
ontap(e : UniNativeViewEvent) { methods: {
uni.showToast({ ontap(e : UniNativeViewEvent) {
title: "按钮被点击了" uni.showToast({
}) title: "按钮被点击了"
}, })
onload() { this.clickCount ++
//标记已初始化 用于自动化测试 this.buttonText = "native-button"+this.clickCount
this.isLoad = true },
}, onload() {
onChanged(e : UniNativeViewEvent) { //标记已初始化 用于自动化测试
console.log("onchanged-----", e.detail) this.isLoad = true
} },
} onChanged(e : UniNativeViewEvent) {
} console.log("onchanged-----", e.detail)
</script> }
}
<style> }
.native-button { </script>
height: 100px;
width: 100px; <style>
margin: 25px auto 25px auto; .native-button {
} height: 100px;
width: 100px;
.native-time-picker { margin: 25px auto 25px auto;
margin: 10px auto 25px auto; }
border-style: solid;
border-radius: 5px; .native-time-picker {
} margin: 10px auto 25px auto;
border-style: solid;
border-radius: 5px;
}
</style> </style>
<template> <template>
<native-view @init="onviewinit" @customClick="ontap"></native-view> <native-view @init="onviewinit" @customClick="ontap"></native-view>
</template> </template>
<script lang="uts"> <script setup lang="uts">
import { NativeButton } from "@/uni_modules/native-button"; import { NativeButton } from "@/uni_modules/native-button";
export default { let button : NativeButton | null = null
data() {
return { //声明属性
button: null as NativeButton | null, const props = defineProps<{ text : string }>()
value: ""
} //声明事件
}, const emit = defineEmits<{
props: { (e : "load") : void
"text": { (e : "buttonTap", event : UniNativeViewEvent) : void
type: String, }>()
default: ''
} //声明方法
}, function updateText(value : string) {
watch: { button?.updateText(value)
"text": { }
handler(newValue : string, oldValue : string) {
this.value = newValue //监听属性变化
this.updateText(newValue) watchEffect(() => {
}, const text = props.text
immediate: true updateText(text)
}, })
},
methods: { //native-view初始化时触发此方法
//native-view初始化时触发此方法 function onviewinit(e : UniNativeViewInitEvent) {
onviewinit(e : UniNativeViewInitEvent) { //获取UniNativeViewElement 传递给NativeButton对象
//获取UniNativeViewElement 传递给NativeButton对象 button = new NativeButton(e.detail.element);
this.button = new NativeButton(e.detail.element); updateText(props.text)
this.button?.updateText(this.value) emit("load")
this.$emit("load") }
},
ontap(e: UniNativeViewEvent) { function ontap(e : UniNativeViewEvent) {
this.$emit("buttonTap", e) emit("buttonTap", e)
}, }
updateText(value: string) {
this.button?.updateText(value) function onUnmounted() {
} // iOS平台需要主动释放 uts 实例
}, button?.destroy()
unmounted() { }
// iOS平台需要主动释放 uts 实例
this.button?.destroy()
}
}
</script> </script>
{ {
"id": "uni-native-button", "id": "native-button",
"displayName": "uni-native-button", "displayName": "native-button",
"version": "0.0.1", "version": "0.0.1",
"description": "vue开发button原生组件", "description": "vue开发button原生组件",
"keywords": [
"tencent",
"map",
"tmap"
],
"repository": "", "repository": "",
"engines": { "engines": {
"HBuilderX": "^4.25" "HBuilderX": "^4.25"
......
{ {
"id": "uni-time-picker", "id": "native-time-picker",
"displayName": "uni-time-picker", "displayName": "native-time-picker",
"version": "1.0.0", "version": "1.0.0",
"description": "uni-time-picker", "description": "native-time-picker",
"keywords": [
"uni-time-picker"
],
"repository": "", "repository": "",
"engines": { "engines": {
"HBuilderX": "^3.1.0" "HBuilderX": "^3.1.0"
...@@ -80,4 +77,4 @@ ...@@ -80,4 +77,4 @@
} }
} }
} }
} }
\ No newline at end of file
# uni-time-picker # native-time-picker
\ No newline at end of file
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册