记录一次Vue中用Canvas制作一个签名面板（插件）

npm install vue-esign --save

在main.js中引入

import vueEsign from 'vue-esign'
Vue.use(vueEsign)

    

      
      
    
    清空画板
    生成图片

export default {
  name: 'HelloWorld',
  data () {
    return {
      lineWidth: 3,
      lineColor: 'red',
      bgColor: '',
      resultImg: '',
      isCrop: false
    }
  },
  methods: {
    handleReset () {
      this.$refs.esign.reset()
      this.resultImg = ''
    },
    handleGenerate () {
      this.$refs.esign.generate().then(res => {
        console.log(res)
        this.resultImg = res
      }).catch(err => {
        console.log(err)
      })
    }
  },
}

github地址：https://github.com/JaimeCheng/vue-esign