w-front-end / Worship_and_learn_upward · Commits

Commit eec9ce4f04325a5a96466dfcde6ef2f8d2c818f8

Authored by zhiyangdu
1 parent 885316de

图片文字合成

Inline Side-by-side
Showing 1 changed file with 8 additions and 20 deletions
src/pages/test.vue
  View file @eec9ce4
... ... @@ -3,10 +3,13 @@
3 3 <div class="index">
4 4 <div class="canvas" ref="canvas">
5 5 <div class="avatar">
6   - <img :src=imgUrl alt="">
  6 + <img src="https://wjjtest.ys2.cnliveimg.com/shop/img/2019/12/31/5e0b06db22be5.jpg" alt="">
  7 + </div>
  8 + <div>
  9 + 杜致阳签名
7 10 </div>
8 11 </div>
9   - <div class="save_btn" @click="getimgUrl">
  12 + <div class="save_btn" @click="savecanvas">
10 13 保存图片
11 14 </div>
12 15 </div>
... ... @@ -16,24 +19,11 @@
16 19 export default {
17 20 data () {
18 21 return {
19   - imgUrl:'https://wjjtest.ys2.cnliveimg.com/shop/img/2019/12/31/5e0b06db22be5.jpg'
20 22 };
21 23 },
22 24 mounted(){
23 25 },
24 26 methods: {
25   - // 直接获取图片url传给原生
26   - getimgUrl(){
27   - // 调用原生方法
28   - // 调用分享（新方法）
29   - if (window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers.CNDSCheckAllowVisitPhotoAlbumHandler) {
30   - // 获取URL图片
31   - window.webkit.messageHandlers.CNDSCheckAllowVisitPhotoAlbumHandler.postMessage({body: {imgUrl: this.imgUrl}});
32   - } else if (window.obj && window.obj.CNDSCheckAllowVisitPhotoAlbumHandler) {
33   - // 获取URL图片
34   - window.obj.CNDSCheckAllowVisitPhotoAlbumHandler(this.imgUrl);
35   - }
36   - },
37 27 savecanvas(){
38 28 let canvas = document.querySelector('.canvas');
39 29 let that = this;
... ... @@ -48,7 +38,6 @@
48 38 };
49 39 imgData = imgData.replace(_fixType(type),'image/octet-stream');
50 40 let filename = "UUSound" + '.' + type;
51   - debugger
52 41 that.saveFile(imgData,filename);
53 42 });
54 43 },
... ... @@ -59,8 +48,7 @@
59 48  
60 49 let event = document.createEvent('MouseEvents');
61 50 event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
62   -// save_link.dispatchEvent(event);
63   - console.log(data)
  51 + save_link.dispatchEvent(event);
64 52 }
65 53 }
66 54 }
... ... @@ -81,11 +69,11 @@
81 69 }
82 70 .save_btn{
83 71 height: 100px;
84   - background: #333333;
85 72 line-height: 100px;
  73 + background: #333333;
86 74 text-align: center;
87 75 color: #ffffff;
88   - font-size: 30px;
  76 + font-size: 36px;
89 77 }
90 78 }
91 79 </style>
... ...