Skip to content

Instantly share code, notes, and snippets.

@yushulx
Last active June 14, 2019 02:13
Show Gist options
  • Save yushulx/a1bb590d8442456cb8d7d96f9b553cc0 to your computer and use it in GitHub Desktop.
Save yushulx/a1bb590d8442456cb8d7d96f9b553cc0 to your computer and use it in GitHub Desktop.
How to use Dynamic Web TWAIN with Vue.js
var app = new Vue({
el: '#app',
data: {
title: 'DWT + Vue.js',
button: 'Scan'
},
methods: {
acquireImage: function () {
var DWObject = Dynamsoft.WebTwainEnv.GetWebTwain('dwtcontrolContainer');
DWObject.IfDisableSourceAfterAcquire = true;
var bSelected = DWObject.SelectSource();
if (bSelected) {
var OnAcquireImageSuccess, OnAcquireImageFailure;
OnAcquireImageSuccess = OnAcquireImageFailure = function () {
DWObject.CloseSource();
};
DWObject.OpenSource();
DWObject.AcquireImage(OnAcquireImageSuccess, OnAcquireImageFailure);
}
}
}
})
<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
<script src="https://unpkg.com/vue"></script>
<script type="text/javascript" src="https://tst.dynamsoft.com/libs/dwt/14.3.1/dynamsoft.webtwain.min.js">
</script>
</head>
<body>
<div id="app">
<h1>{{ title }}</h1>
<button v-on:click="acquireImage">{{ button }}</button>
<div id="dwtcontrolContainer"></div>
</div>
<script type="text/javascript" src="app.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment