Skip to content

Commit 979fe73

Browse files
author
Luiz Eduardo
committed
Realização de exercício
1 parent b9cae54 commit 979fe73

File tree

3 files changed

+47
-1
lines changed

3 files changed

+47
-1
lines changed

‎html/exemplo3.html‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
<meta http-equiv="X-UA-Compatible" content="IE=edge">
66
<title>VueJS</title>
77
<link rel="stylesheet" href="">
8-
<script src="vue.js"></script>
98
</head>
109
<body>
1110
<div id="app">

‎html/exercises.html‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<title>VueJS - Exercises</title>
7+
<link rel="stylesheet" href="">
8+
</head>
9+
<body>
10+
11+
<div id="app">
12+
<!-- 1) Fill the <p> below with your Name and Age - using Interpolation -->
13+
<p>VueJS is pretty cool - {{ YOUR_NAME }} ({{ YOUR_AGE }})</p>
14+
15+
<!-- 2) Output your age, multiplied by 3 -->
16+
<p>{{ YOUR_AGE * 3 }}</p>
17+
18+
<!-- 3) Call a function to output a random float between 0 and 1 (Math.random()) -->
19+
<p>{{ randomNumber() }}</p>
20+
21+
<!-- 4) Search any image on Google and output it here by binding the "src" attribute -->
22+
<div>
23+
<img style="width:100px;height:100px" v-bind:src="IMAGE">
24+
</div>
25+
26+
<!-- 5) Pre-Populate this input with your name (set the "value" attribute) -->
27+
<div>
28+
<input type="text" v-bind:value="YOUR_NAME">
29+
</div>
30+
</div>
31+
<script src="https://unpkg.com/vue/dist/vue.js"></script>
32+
<script src="../js/exercises.js"></script>
33+
</body>
34+
</html>

‎js/exercises.js‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
new Vue({
2+
el: '#app',
3+
data:{
4+
YOUR_NAME: 'Luiz Eduardo Martins',
5+
YOUR_AGE: '24',
6+
IMAGE: 'https://thumbor.forbes.com/thumbor/100x0/smart/https%3A%2F%2Fblogs-images.forbes.com%2Fstartswithabang%2Ffiles%2F2017%2F12%2Fflying-galaxy-in-cluster.jpg'
7+
},
8+
methods: {
9+
randomNumber: function(){
10+
return Math.random();
11+
}
12+
}
13+
});

0 commit comments

Comments
 (0)