Created
April 25, 2018 21:47
-
-
Save aaronksaunders/6f23bfbde6a26b2ef7360b62bfd71b0f to your computer and use it in GitHub Desktop.
JS Bin // source https://jsbin.com/hojahasise
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width"> | |
| <title>JS Bin</title> | |
| </head> | |
| <body> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.3/vue.js"></script> | |
| <h1> top of the page</h1> | |
| <p>test</p> | |
| <!-- vue stuff here --> | |
| <div id="app"> | |
| {{ message }} | |
| <div> | |
| <!-- listen for click on button and then call --> | |
| <!-- the method 'reverse' --> | |
| <input v-model="newText"> | |
| <button v-on:click="changeMessage('$500')"> | |
| Change Message | |
| </button> | |
| <button v-on:click="changeMessage('$500')"> | |
| Reset Message | |
| </button> | |
| </div> | |
| </div> | |
| <script id="jsbin-javascript"> | |
| var app5 = new Vue({ | |
| el: '#app', | |
| data: { | |
| message: 'Hello', | |
| name : "Aaron Saunders", | |
| num : 78 + 8, | |
| newText : "" | |
| }, | |
| methods: { | |
| reverse: function () { | |
| this.message = this.message.split('').reverse().join('') | |
| }, | |
| changeMessage: function(value) { | |
| this.message = this.message + " " + this.newText | |
| }, | |
| resetMessage: function() { | |
| this.message = "Hello" | |
| } | |
| } | |
| }) | |
| </script> | |
| <script id="jsbin-source-javascript" type="text/javascript"> | |
| var app5 = new Vue({ | |
| el: '#app', | |
| data: { | |
| message: 'Hello', | |
| name : "Aaron Saunders", | |
| num : 78 + 8, | |
| newText : "" | |
| }, | |
| methods: { | |
| reverse: function () { | |
| this.message = this.message.split('').reverse().join('') | |
| }, | |
| changeMessage: function(value) { | |
| this.message = this.message + " " + this.newText | |
| }, | |
| resetMessage: function() { | |
| this.message = "Hello" | |
| } | |
| } | |
| })</script></body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var app5 = new Vue({ | |
| el: '#app', | |
| data: { | |
| message: 'Hello', | |
| name : "Aaron Saunders", | |
| num : 78 + 8, | |
| newText : "" | |
| }, | |
| methods: { | |
| reverse: function () { | |
| this.message = this.message.split('').reverse().join('') | |
| }, | |
| changeMessage: function(value) { | |
| this.message = this.message + " " + this.newText | |
| }, | |
| resetMessage: function() { | |
| this.message = "Hello" | |
| } | |
| } | |
| }) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment