预览效果github源代码核心代码exportdefault{data(){return{chess:{},context:{},chessBoard:[],//记录你是否超过了我:true,count:0,//个数ofallwinningwayswins:[],//获胜方法数组myWin:[],//统计我们获胜方法数组computerWin:[],//统计计算机获胜方法数组over:false,}},mounted(){setTimeout(_=>{this.init()})},methods:{//初始化init(){this.chess=this.$refs.canvasthis.context=this.chess.getContext("2d")this.drawImage(_=>{this.drawChessBoard()})this.fillArray()},//填充数组fillArray(){//是否遍历for(leti=0;i<15;i++){this.chessBoard[i]=[]for(letj=0;j<15;j++){this.chessBoard[i][j]=0}}//获胜数组for(leti=0;i<15;i++){this.wins[i]=[]for(letj=0;j<15;j++){this.wins[i][j]=[]}}//水平for(leti=0;i<15;i++){for(letj=0;j<11;j++){for(letk=0;k<5;k++){this.wins[i][j+k][this.count]=true}this.count++}}//竖for(leti=0;i<15;i++){for(letj=0;j<11;j++){for(letk=0;k<5;k++){this.wins[j+k][i][this.count]=true}this.count++}}//倾斜for(leti=0;i<11;i++){for(letj=0;j<11;j++){for(letk=0;k<5;k++){this.wins[i+k][j+k][this.count]=true}this.count++}}//反斜for(leti=0;i<11;i++){for(letj=14;j>3;j--){for(letk=0;k<5;k++){this.wins[i+k][j-k][this.count]=true}this.count++}}//获胜的统计组for(leti=0;i{context.drawImage(img,(450-img.width)/2,(450-img.height)/2,img.width,img.height)callback()}},//绘制棋盘drawChessBoard(){const{context}=thiscontext.strokeStyle='#bfbfbf'for(leti=0;i<15;i++){context.moveTo(15+i*30,15)context.lineTo(15+i*30,435)context.stroke()context.moveTo(15,15+i*30)context.lineTo(435,15+i*30)context.stroke()}},//落子实现onStep(x,y,me){const{context}=thiscontext.beginPath()context.arc(15+x*30,15+y*30,13,0,2*Math.PI)context.closePath()constgradient=context.createRadialGradient(15+x*30+2,15+y*30-2,13,15+x*30+2,15+y*30-2,0)if(me){gradient.addColorStop(0,'#0a0a0a')gradient.addColorStop(1,'#636766')}else{gradient.addColorStop(0,'#d1d1d1')gradient.addColorStop(1,'#f9f9f9')}context.fillStyle=gradientcontext.fill()},//我们的游戏chessClick(e){if(this.over){return}if(!this.me){return}constox=e.offsetXconstoy=e.offsetYconstx=Math.floor(ox/30)consty=Math.floor(oy/30)if(this.chessBoard[x][y]===0){this.chessBoard[x][y]=1this.onStep(x,y,this.me)//统计获胜方法for(letk=0;kmax){max=myScore[i][j]u=iv=j}elseif(myScore[i][j]===max){if(computerScore[i][j]>computerScore[u][v]){u=iv=j}}if(computerScore[i][j]>max){max=computerScore[i][j]u=iv=j}elseif(computerScore[i][j]===max){if(myScore[i][j]>myScore[u][v]){u=iv=j}}}}}this.onStep(u,v,false)this.chessBoard[u][v]=2//统计获胜法for(letk=0;k
