vue实现华容道九宫格小游戏代码-html代码-BFW代码库

vue实现华容道九宫格小游戏代码

代码语言：html

所属分类：游戏

代码描述：vue实现华容道九宫格小游戏代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue.global.3.2.20.js"></script>


<style>
    .box {
	border:5px solid rgb(218,195,147);
	display:flex;
	flex-wrap:wrap;
	background-color:black;
}
.item {
	width:100px;
	height:100px;
	background-color:rgb(247,170,3);
	border:1px solid rgb(189,133,12);
	color:white;
	text-align:center;
	line-height:100px;
	font-size:20px;
	cursor:pointer;
	user-select:none;
	position:relative;
	left:0;
}
.empty {
	background-color:black;
}

</style>
</head>
<body>
    <div id="app">
        <div class="box" :style="{width,height}">
            <div class="item" :class="{'empty':item == -1}" v-for="(item, index) in list" @click="onSwitch(item,index)" ref="item">
                {{item != -1?item:�.........完整代码请登录后点击上方下载按钮下载查看