Skip to content

Instantly share code, notes, and snippets.

@PavelPolyakov
Created July 13, 2015 20:57
Show Gist options
  • Save PavelPolyakov/bdadb5835cc281b0be72 to your computer and use it in GitHub Desktop.
Save PavelPolyakov/bdadb5835cc281b0be72 to your computer and use it in GitHub Desktop.
trying vueify
<template>
<button type="button"
class="btn btn-lg btn-success"
style="margin: 10px;"
v-class="disabled: isMaxResponses"
v-on="click: addResponse">
<span class="glyphicon glyphicon-plus"></span> Add Response
</button>
<response v-repeat="responses" remove-response="{{removeResponse}}"></response>
</template>
<script>
// application builder, one per application
module.exports = {
el : '.builder',
data : {
responses: [
{
'uuid' : UUID.generate(),
'title': 'response #1'
}
]
}
,
methods : {
addResponse : function () {
if (this.isMaxResponses) {
return false;
}
console.log('adding ' + (this.responses.length + 1));
var data = {title: 'response #' + (this.responses.length + 1), uuid: UUID.generate()};
console.log(data);
this.responses.push(data);
},
removeResponse: function (response) {
this.responses.$remove(response);
}
},
computed: {
isMaxResponses: function () {
return this.responses.length === 5;
}
}
};
</script>
<div class="container">
<div class="starter-template">
<h1>TwilioCMS</h1>
<p class="lead">Start building your application</p>
{{ salutation }}
</div>
<div class="builder">
</div>
</div><!-- /.container -->
var Vue = require('vue');
var builder = require('./components/builder.vue');
var response = require('./components/response.vue');
var addVerbModal = require('./components/add-verb-modal.vue');
var app = new Vue({
el : 'body',
data : {
salutation: ', hurray!'
},
children: [builder],
methods : {
lll: function () {
console.log('lll');
}
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment