vue-camera-outer

Project setup

yarn install

Compiles and hot-reloads for development

yarn serve

Compiles and minifies for production

yarn build

Lints and fixes files

yarn lint

Customize configuration

See Configuration Reference.

Examples

main.js

// 导入组件库
import VueCameraOuter from 'vue-camera-outer'

// 注册组件库
Vue.use(VueCameraOuter)

examples.vue

<template>
  <div class="example">
    <vue-camera-outer :config="config" @getImage="getImage" ref="camera" />
    <div @click="handleGetImage()">图片抓拍</div>
  </div>
</template>

<script>
export default {
  name: 'examples',
  data() {
    return {
      config: {
        imageType: 'png',
        quality: 1,
        width: 320,
        height: 240,
        swffile: 'static/jquery-webcam/jscam_canvas_only.swf', //static对应的swf文件
      }
    }
  },
  methods: {
    handleGetImage(){
      this.$refs.camera.getImage()
    },
    getImage(e){
      console.log(e)
    },
  }
}
</script>

<style scoped>

</style>