File tree Expand file tree Collapse file tree 2 files changed +2
-31
lines changed
docs/app/pages/Components/File/examples
src/components/MdField/MdFile Expand file tree Collapse file tree 2 files changed +2
-31
lines changed Original file line number Diff line number Diff line change 1
1
<template >
2
2
<div >
3
3
<md-field >
4
- <md-icon md-file-trigger >attach_file</md-icon >
5
4
<label >Single</label >
6
5
<md-file v-model =" single" />
7
6
</md-field >
8
7
9
8
<md-field >
10
- <md-icon md-file-trigger >attach_file</md-icon >
11
9
<label >Upload files</label >
12
10
<md-file v-model =" placeholder" placeholder =" A nice input placeholder" />
13
11
</md-field >
14
12
15
13
<md-field >
16
- <md-icon md-file-trigger >attach_file</md-icon >
17
14
<label >Disabled</label >
18
15
<md-file v-model =" disabled" disabled />
19
16
</md-field >
20
17
21
18
<md-field >
22
- <md-icon md-file-trigger >attach_file</md-icon >
23
19
<label >Initial value</label >
24
20
<md-file v-model =" initial" />
25
21
</md-field >
26
22
27
23
<md-field >
28
- <md-icon md-file-trigger >attach_file</md-icon >
29
24
<label >Multiple</label >
30
25
<md-file v-model =" multiple" multiple />
31
26
</md-field >
32
27
33
28
<md-field >
34
- <md-icon md-file-trigger >attach_file</md-icon >
35
29
<label >Only images</label >
36
30
<md-file v-model =" single" accept =" image/*" />
37
31
</md-field >
Original file line number Diff line number Diff line change 1
1
<template >
2
2
<div class =" md-file" >
3
+ <md-file-icon @click.native =" openPicker" />
4
+
3
5
<input
4
6
class =" md-input"
5
7
readonly
29
31
},
30
32
name: String
31
33
},
32
- data () {
33
- return {
34
- triggerEl: null
35
- }
36
- },
37
34
mixins: [MdFieldMixin],
38
35
inject: [' MdField' ],
39
36
methods: {
76
73
created () {
77
74
this .MdField .file = true
78
75
},
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
- },
87
76
beforeDestroy () {
88
77
this .MdField .file = false
89
-
90
- if (this .triggerEl ) {
91
- this .triggerEl .removeEventListener (' click' , this .openPicker )
92
- }
93
78
}
94
79
}
95
80
</script >
114
99
cursor : pointer ;
115
100
}
116
101
}
117
-
118
- .md-field {
119
- & .md-has-file {
120
- [md-file-trigger ] {
121
- cursor : pointer ;
122
- }
123
- }
124
- }
125
102
</style >
You can’t perform that action at this time.
0 commit comments