Skip to content

Instantly share code, notes, and snippets.

@filipgorczynski
Last active September 23, 2017 10:06
Show Gist options
  • Select an option

  • Save filipgorczynski/ffecd16d5976053dca99397fc21e1af4 to your computer and use it in GitHub Desktop.

Select an option

Save filipgorczynski/ffecd16d5976053dca99397fc21e1af4 to your computer and use it in GitHub Desktop.
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<div id="exercise">
<!-- 1) Fill the <p> below with your Name and Age - using Interpolation -->
<p>VueJS is pretty cool - {{ name }} ({{ age }})</p>
<!-- 2) Output your age, multiplied by 3 -->
<p>{{ age * 3 }}</p>
<!-- 3) Call a function to output a random float between 0 and 1 (Math.random()) -->
<p>{{ Math.random() }}</p>
<!-- 4) Search any image on Google and output it here by binding the "src" attribute -->
<div>
<img style="width:100px;height:100px" :src="imgUrl" />
</div>
<!-- 5) Pre-Populate this input with your name (set the "value" attribute) -->
<div>
<input type="text" :value="name" />
</div>
</div>
<script>
new Vue({
el: '#exercise',
data: {
name: 'Filip',
age: 33,
imgUrl: 'https://goo.gl/DMXTMV',
}
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment