正文
uni-app $refs的基本用法
小程序:扫一扫查出行
【扫一扫了解最新限行尾号】
复制小程序
【扫一扫了解最新限行尾号】
复制小程序
$refs的基本用法
一个对象(Object),持有注册过 ref
特性 的所有 DOM 元素和组件实例。
<template>
<view class="container" style="background: #0FAEFF;">
<view class="child"> hi {{showModal}}</view>
</view>
</template>
<script>
export default {
props: {
showModal: {
type: String,
default: 'hello'
}
},
data() {
return {
childdata: 'child value'
};
},
methods: {
sayHello() {
console.info("--child:--" + this.showModal);
}
}
}
</script>
child
<template>
<view class="container">
<child :showModal="showModal" ref="vref"></child> <button @tap="refMethods" type="primary" >点击</button>
</view>
</template><script>
import child from "../../components/child.vue" export default {
components: {
child
},
data() {
return {
showModal: " parent say",
parentValue: '',
syncDate: ' p syncDate'
};
},
methods: {
refMethods() {
var child = this.$refs.vref;
child.sayHello();
} }
}
</script><style></style>
parent