Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Vue on rails sample
<div id="user_info">
</div>
<script>
javascript_tag do
<<-JS
window.User = window.User || #{@json_from_controller_or_wherever.html_safe};
JS
end
</script>
<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<%= render "user_info" %>
<script src="./user_info.js"></script>
</body>
</html>
new Vue({
data() {
return {
user: {
first_name: '',
last_name: '',
}
}
},
template: `
<div>
<h1 v-text="fullName"></h1>
</div>
`,
computed: {
fullName() {
return `${this.user.first_name} ${this.user.last_name}`
}
},
created() {
if (window.User) {
this.user = window.User
}
}
}).$mount('#user_info')
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.