+31
-2
lines changedFilter options
+31
-2
lines changed Original file line number Diff line number Diff line change
@@ -1,31 +1,37 @@
1 1
<template>
2 2
<div>
3 3
<md-field>
4 +
<md-icon md-file-trigger>attach_file</md-icon>
4 5
<label>Single</label>
5 6
<md-file v-model="single" />
6 7
</md-field>
7 8 8 9
<md-field>
10 +
<md-icon md-file-trigger>attach_file</md-icon>
9 11
<label>Upload files</label>
10 12
<md-file v-model="placeholder" placeholder="A nice input placeholder" />
11 13
</md-field>
12 14 13 15
<md-field>
16 +
<md-icon md-file-trigger>attach_file</md-icon>
14 17
<label>Disabled</label>
15 18
<md-file v-model="disabled" disabled/>
16 19
</md-field>
17 20 18 21
<md-field>
22 +
<md-icon md-file-trigger>attach_file</md-icon>
19 23
<label>Initial value</label>
20 24
<md-file v-model="initial" />
21 25
</md-field>
22 26 23 27
<md-field>
28 +
<md-icon md-file-trigger>attach_file</md-icon>
24 29
<label>Multiple</label>
25 30
<md-file v-model="multiple" multiple />
26 31
</md-field>
27 32 28 33
<md-field>
34 +
<md-icon md-file-trigger>attach_file</md-icon>
29 35
<label>Only images</label>
30 36
<md-file v-model="single" accept="image/*" />
31 37
</md-field>
@@ -1,7 +1,5 @@
1 1
<template>
2 2
<div class="md-file">
3 -
<md-file-icon @click.native="openPicker" />
4 - 5 3
<input
6 4
class="md-input"
7 5
readonly
@@ -31,6 +29,11 @@
31 29
},
32 30
name: String
33 31
},
32 +
data () {
33 +
return {
34 +
triggerEl: null
35 +
}
36 +
},
34 37
mixins: [MdFieldMixin],
35 38
inject: ['MdField'],
36 39
methods: {
@@ -73,8 +76,20 @@
73 76
created () {
74 77
this.MdField.file = true
75 78
},
79 +
mounted () {
80 +
this.$nextTick().then(() => {
81 +
this.triggerEl = this.MdField.$el.querySelector('[md-file-trigger]')
82 +
if (this.triggerEl) {
83 +
this.triggerEl.addEventListener('click', this.openPicker)
84 +
}
85 +
})
86 +
},
76 87
beforeDestroy () {
77 88
this.MdField.file = false
89 + 90 +
if (this.triggerEl) {
91 +
this.triggerEl.removeEventListener('click', this.openPicker)
92 +
}
78 93
}
79 94
}
80 95
</script>
@@ -99,4 +114,12 @@
99 114
cursor: pointer;
100 115
}
101 116
}
117 + 118 +
.md-field {
119 +
&.md-has-file {
120 +
[md-file-trigger] {
121 +
cursor: pointer;
122 +
}
123 +
}
124 +
}
102 125
</style>
You can’t perform that action at this time.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4