Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit 956fa43

Browse files
🆕 Add initial commit
1 parent 519961a commit 956fa43

File tree

3 files changed

+173
-0
lines changed

3 files changed

+173
-0
lines changed

‎README.md‎

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,89 @@
11
# vuejs-snippets
2+
23
VueJS Components Snippets for Atom
4+
5+
---
6+
7+
## Types
8+
9+
- .text.html.vue
10+
11+
## Snippets
12+
13+
### Vue Component
14+
15+
prefix: component
16+
17+
body:
18+
```
19+
<template>
20+
//You component contents goes here, only html.
21+
</template>
22+
23+
<script>
24+
25+
export default {
26+
name: "ComponentName",
27+
data(){
28+
return {
29+
//Component Data
30+
example: true,
31+
foo: "bar"
32+
}
33+
},
34+
35+
created(){
36+
//On Component created
37+
},
38+
39+
methods: {
40+
functionExample(){
41+
//Basic Component method
42+
}
43+
}
44+
}
45+
</script>
46+
```
47+
48+
### Vue Modal Component
49+
50+
prefix: modal
51+
52+
body:
53+
54+
<template>
55+
<modal :show.sync="showModal">
56+
<h2 slot="header">{{$t("change_password.title")}}</h2>
57+
<div slot="body">
58+
//You component contents goes here, only html.
59+
</div>
60+
<div slot="footer" class="text-center">
61+
</div>
62+
</modal>
63+
</template>
64+
65+
<script>
66+
import Modal from './interface/Modal.vue'
67+
68+
export default {
69+
name: "ComponentName",
70+
components: { Modal },
71+
data(){
72+
return {
73+
//Component Data
74+
showModal: false,
75+
}
76+
},
77+
78+
created(){
79+
//On Component created
80+
this.showModal = true;
81+
},
82+
83+
methods: {
84+
functionExample(){
85+
//Basic Component method
86+
}
87+
}
88+
}
89+
</script>

‎package.json‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"name": "vuejs-components",
3+
"version": "0.0.1",
4+
"description": "VueJS Components Snippets for Atom",
5+
"keywords": [],
6+
"repository": "https://github.com/cezardasilva/vuejs-snippets",
7+
"license": "MIT",
8+
"engines": {
9+
"atom": ">=1.0.0 <2.0.0"
10+
},
11+
"dependencies": {}
12+
}

‎snippets/vue-components.cson‎

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
'.text.html.vue':
2+
'Vue Component':
3+
'prefix': 'component'
4+
'description': 'This snippet generates the basic structure for a Vue JS Component'
5+
'body': """
6+
<template>
7+
//You component contents goes here, only html.
8+
</template>
9+
10+
<script>
11+
12+
export default {
13+
name: "ComponentName",
14+
data(){
15+
return {
16+
//Component Data
17+
example: true,
18+
foo: "bar"
19+
}
20+
},
21+
22+
created(){
23+
//On Component created
24+
},
25+
26+
methods: {
27+
functionExample(){
28+
//Basic Component method
29+
}
30+
}
31+
}
32+
</script>
33+
"""
34+
'Vue Component Modal':
35+
'prefix': 'modal'
36+
'description': 'This snippet generates the basic structure for a Vue JS Component with a modal'
37+
'body': """
38+
<template>
39+
<modal :show.sync="showModal">
40+
<h2 slot="header">{{$t("change_password.title")}}</h2>
41+
<div slot="body">
42+
//You component contents goes here, only html.
43+
</div>
44+
<div slot="footer" class="text-center">
45+
</div>
46+
</modal>
47+
</template>
48+
49+
<script>
50+
import Modal from './interface/Modal.vue'
51+
52+
export default {
53+
name: "ComponentName",
54+
components: { Modal },
55+
data(){
56+
return {
57+
//Component Data
58+
showModal: false,
59+
}
60+
},
61+
62+
created(){
63+
//On Component created
64+
this.showModal = true;
65+
},
66+
67+
methods: {
68+
functionExample(){
69+
//Basic Component method
70+
}
71+
}
72+
}
73+
</script>
74+
"""

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /