FabricJs项目【简易画板】--项目搭建

628 阅读1分钟

b站 FabricJs项目【简易画笔】--项目搭建

项目相关的代码

git clone https://github.com/shch/vuefabric.git //克隆项目

vue create . //创建项目 

npm run serve //项目本地启动

git push //推送代码

npm install fabric --save //下载库

fabricjs 相关代码

<template>
  <div class="home">
    <canvas id="c" width="400" height="400"></canvas>
  </div>
</template>

<script>
// @ is an alias to /src
import { fabric } from "fabric";

export default {
  name: 'Home',
  mounted(){

    var canvas = new fabric.Canvas("c");
    var rect = new fabric.Rect({
        left: 100,
        top: 100,
        fill: 'red',
        width: 400,
        height: 400
        });
        canvas.add(rect);
    }
  }
  
</script>

参考

  1. 官网地址
  2. vue官网
  3. vue cli 官网
  4. github 项目地址

联系我

加我的wx:meetbc,关注我的公众号:大前端说。欢迎交流关于前端的任何话题。