| 1 | <!DOCTYPE html>
|
| 2 | <html>
|
| 3 | <head>
|
| 4 | <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
|
| 5 | <title></title>
|
| 6 | </head>
|
| 7 | <body>
|
| 8 | <div id="app"></div>
|
| 9 | <script src="https://cdn.bootcss.com/vue/2.3.3/vue.min.js"></script>
|
| 10 | <script src="../../dist/uploader.js"></script>
|
| 11 | <script type="text/javascript">
|
| 12 | var Uploader = uploader.Uploader;
|
| 13 | new Vue({
|
| 14 | el: '#app',
|
| 15 | components: {
|
| 16 | Uploader,
|
| 17 | },
|
| 18 | template: '<Uploader ref="uploader" :size="4" @request="onRequest" @click="onClick" @remove="onRemove"><Uploader>',
|
| 19 | methods: {
|
| 20 | onRequest() {
|
| 21 | console.log('try to request new image');
|
| 22 | },
|
| 23 | onRemove(index) {
|
| 24 | console.log('try to remove image in index: ', index);
|
| 25 | },
|
| 26 | onClick(index) {
|
| 27 | console.log('try to click image in index: ', index);
|
| 28 | },
|
| 29 | },
|
| 30 | mounted: function() {
|
| 31 | console.log(this.$refs.uploader);
|
| 32 | this.$refs.uploader.setImages([
|
| 33 | './avatar.jpg',
|
| 34 | ]);
|
| 35 | var result = this.$refs.uploader.add('./avatar.jpg');
|
| 36 | console.log('result is', result);
|
| 37 | },
|
| 38 | });
|
| 39 | </script>
|
| 40 | </body>
|
| 41 | </html> |
| \ | No newline at end of file |