qq_37813237 2022-10-11 09:59 采纳率: 100%
浏览 226
已结题

vue+canvas第一次加载不显示

问题遇到的现象和发生背景

想使用vue+canvas,但是使用canvas后,第一次加载不显示,要刷新以后才显示。

用代码块功能插入代码,请勿粘贴截图
<template>
    <div id="app">
        <canvas id="mycanvas" width="500" height="500"></canvas>
    </div>
</template>
 
<script>
    export default {
        name: 'cvs',
        mounted() {
            this.draw();
            
        },
        methods: {
            draw() {
                window.onload = function() {
                    var c = document.getElementById("mycanvas");
                    var ctx = c.getContext("2d");
                    ctx.beginPath();
                    // ctx.moveTo(50,150);
                    // ctx.lineTo(350,150);
                    // ctx.strokeStyle = 'green';
                    // ctx.lineWidth = 5;
                    ctx.fillRect(100,200,300,400)
                    ctx.stroke();
                    ctx.closePath();
                };
            }
        }
    }
</script>
 
<style>
</style>

运行结果及报错内容

第一次加载

img


刷新后

img

  • 写回答

3条回答 默认 最新

      报告相同问题?

      相关推荐 更多相似问题

      问题事件

      • 系统已结题 10月19日
      • 已采纳回答 10月11日
      • 创建了问题 10月11日

      悬赏问题

      • ¥15 工具变量 时间序列相关问题
      • ¥15 正弦波的峰值查找算法
      • ¥15 关于lwip的pbuf数据提取问题
      • ¥50 请求关于BBS数据集的资源分享
      • ¥15 设计一份接口自动化测试报告
      • ¥15 手机安装kali后ifconfig 提示错误
      • ¥15 用C++求矩阵的特征值
      • ¥30 求解答(自动忽略本括号内容)
      • ¥15 根据C语言小型成绩管理系统画一个流程图
      • ¥15 Javaweb的增删改查