27 May, 2018

টিউটোরিয়াল

rimonmath

1956 views


Vue JS 2 বাংলা টিউটোরিয়াল #6: List Rendering এর সোর্স কোড :

 

 

Source:

index.html:

 

<!DOCTYPE html>
<html>
<head>
	<title>Vue Js Bangla Tutorial</title>
	
</head>
<body>

<div id="root">
	<h1>Skills</h1> <hr>
	<ul>
		<li v-for="(skill, i) in skills">
			{{i+1}}. {{ skill.name }} ({{skill.experience}})
		</li>
	</ul>

</div>




<script type="text/javascript" src="vue.js"></script>
<script type="text/javascript">
	var app = new Vue({
		el: "#root",
		data: {
			skills: [
				{name: "HTML", experience: 5},
				{name: "CSS", experience: 4},
				{name: "JS", experience: 4},
				{name: "php", experience: 3},
				{name: "java", experience: 3},
				{name: "nodejs", experience: 1}
			]
		}
	});
	
</script>

</body>
</html>