集成了iview和vue2.x版本
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>测试</title>
<!-- import Vue.js -->
<script src="http://unpkg.com/vue@2.6.14/dist/vue.min.js"></script>
<!-- import stylesheet -->
<link rel="stylesheet" href="http://unpkg.com/view-design/dist/styles/iview.css">
<!-- import iView -->
<script src="http://unpkg.com/view-design/dist/iview.min.js"></script>
</head>
<body>
<div id="app">
<i-button type="primary" @click="printText">测试打印文字</i-button>
<i-button type="primary" @click="autoOutPaper">测试走纸</i-button>
<i-button type="primary" @click="handlePrintTable">测试表格</i-button>
<i-button type="primary" @click="printLineWrap(2)">打印空白行</i-button>
</div>
<script>
const app = new Vue({
el: '#app',
data() {
return {
visible: false
}
},
methods: {
printText() {
window.NativeApp.printText('我来测试一下', 42, true, true);
},
autoOutPaper() {
window.NativeApp.autoOutPaper()
},
printLineWrap(line) {
window.NativeApp.printLineWrap(line)
},
handleJSON(obj) {
console.log(JSON.stringify(obj));
return JSON.stringify(obj);
},
handlePrintTable() {
let list1 = this.handleJSON(['鸡蛋', '个', '5']);
let list2 = this.handleJSON([1, 1, 1]);
let list3 = this.handleJSON([1, 1, 1]);
window.NativeApp.printTable(list1, list2, list3)
},
}
})
</script>
<style>
body {
margin: 10px;
}
#app {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
</style>
</body>
</html>