微信小程序点人头爆炸

您好，您是想问微信小程序点人头爆炸是什么游戏吗？微信小程序点人头爆炸是16张翻人头游戏。这是一款非常魔性乱埋的日系卡通风格聚会手游。提供了16张不同的大叔头像吵渗，你能够来进行点击，当你点击到愤怒的头像的时候这个头像就会爆炸，则要升陪脊接受游戏惩罚哦。

第一：先在App.vue中全局获取不同手机的轮码顶部高度

在methods:{

getPhoneHeight(){

let that =this

uni.getSystemInfo({

success:function(res){

that.globalData.phoneHeight=res.statusBarHeight

}

})

}

}

第二步

在components中写公共组件

uni-topBar.vue

<template>

<view class="nav-box" style="margin-top:{{phoneHeight}}px">

<view class='nav-top-one'>

<image src='../static/images/tback.png' class="nav-top-left" @click="backpage"></image>

<view class="nav-top-center"></view>

<image src='../static/images/home.png' class="nav-top-right" @click="BackHome"></image>

</view>

<view class="nav-top-text">{{titleName.addredd}}</view>

</view>

</template>

<script>

// app中的全局需要在每个页面进行引入

import app from '../App.vue'

export default {

//

name: "uniNavBar",

// 接受父组件的传值，可以接受多个中 在父组件中用v-bind 来绑定

props: {

// 接受父组件的传值

titleName: {

type: Object

}

},

data() {

return {

phoneHeight:app.globalData.phoneHeight //这里在进行调用

}

},

// 事件嫌谈

methods: {

backpage() {

uni.navigateBack({

delta: 1

})

},

BackHome(){

// 关闭当前页面

uni.switchTab({

url: '/pages/index/index'

})

}

},

// 生命周期

</script>

<style>

.nav-box {

position:relative

padding-left: 16rpx

background:#ffffff

height:76rpx

</style>

第三步：

在需要的页面进行引入 和vue引入公共组件的方法一芹桐碰样

html:

<uniNavBar :titleName="topData"></uniNavBar>

js:

import uniNavBar from "../../../components/uni-nav-bar.vue"

components:{

uniNavBar

},

最后效果显示

悟空—不死谢谢

<view  bindtap="..." />//父组件

<button  羡模catchtap="..." />//子组件

使用vant也是厅橡一样

<van-icon  catchtap="..." />//兄伏缓不能使用vant的bind:click

---