Skip to content

Instantly share code, notes, and snippets.

@vuejsdevelopers
vuejsdevelopers / component.vue
Last active May 10, 2017 07:31
What I Learned About VueJS From Building A Chrome Extension - Snippet 05
<template>
<div id="app">{{ message }}</div>
</template>
@vuejsdevelopers
vuejsdevelopers / build.js
Created May 10, 2017 07:31
What I Learned About VueJS From Building A Chrome Extension - Snippet 06
render: function () {
return this.$createElement("div", {attrs: {id: "app"}}, [this.message])
}
@vuejsdevelopers
vuejsdevelopers / script.js
Created May 25, 2017 14:13
Using JSX with Vue.js - Snippet 01
render (h) {
return h(
'div',
{ attrs: { id: 'my-id' },
[ this.msg ]
);
}
@vuejsdevelopers
vuejsdevelopers / script.js
Created May 25, 2017 14:15
Using JSX with Vue.js - Snippet 02
render (h) {
return (
<div id='my-id'>,
{ this.msg }
</div>
);
}
@vuejsdevelopers
vuejsdevelopers / script.js
Created May 25, 2017 14:16
Using JSX with Vue.js - Snippet 03
new Vue({
el: '#app',
data: {
msg: 'Show the message'
},
methods: {
hello () {
alert('Here is the message')
}
}
@vuejsdevelopers
vuejsdevelopers / index.html
Created May 25, 2017 14:17
Using JSX with Vue.js - Snippet 04
<div id="app">
<span class="my-class" v-on:click="hello">
{{ msg }}
</span>
</div>
@vuejsdevelopers
vuejsdevelopers / script.js
Created May 25, 2017 14:18
Using JSX with Vue.js - Snippet 05
new Vue({
el: '#app',
data: {
msg: 'Show the message'
},
methods: {
hello () {
alert('Here is the message')
}
},
@vuejsdevelopers
vuejsdevelopers / index.html
Created May 25, 2017 14:18
Using JSX with Vue.js - Snippet 06
<div id="app">
<!--span will render here-->
</div>
@vuejsdevelopers
vuejsdevelopers / script.js
Created May 25, 2017 14:19
Using JSX with Vue.js - Snippet 07
new Vue({
el: '#app',
data: {
msg: 'Show the message.'
},
methods: {
hello () {
alert('This is the message.')
}
},
@vuejsdevelopers
vuejsdevelopers / index.html
Created June 1, 2017 02:57
Pre-Render A Vue.js App (With Node Or Laravel) - Snippet 01
<head> ... </head>
<body>
<div id="app">
<!--This is empty, Javascript will populate it later-->
</app>
</body>