<!DOCTYPE html>
<html>
<head>
<title>Vue Js</title>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<style type="text/css">
li{
list-style: none;
}
</style>
<body>
<center>
<div id="root">
<h1>{{ name | lowercase }}</h1>
<h1>{{ profeesion | uppercase }}</h1>
<h1>{{ today | bdformat }}</h1>
</div>
</center>
<!--js plugin-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script>
var app = new Vue({
el:"#root",
data:{
name:"anil kumer",
profeesion:"software engineer",
today:new Date()
},
filters:{
uppercase: function(s){
return s.toUpperCase();
},
lowercase: function(s){
return s.toLowerCase();
},
bdformat:function(d){
return d.getUTCDate()+"-"+d.getUTCMonth()+"-"+d.getUTCFullYear();
}
}
});
</script>
</body>
</html>
<html>
<head>
<title>Vue Js</title>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<style type="text/css">
li{
list-style: none;
}
</style>
<body>
<center>
<div id="root">
<h1>{{ name | lowercase }}</h1>
<h1>{{ profeesion | uppercase }}</h1>
<h1>{{ today | bdformat }}</h1>
</div>
</center>
<!--js plugin-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script>
var app = new Vue({
el:"#root",
data:{
name:"anil kumer",
profeesion:"software engineer",
today:new Date()
},
filters:{
uppercase: function(s){
return s.toUpperCase();
},
lowercase: function(s){
return s.toLowerCase();
},
bdformat:function(d){
return d.getUTCDate()+"-"+d.getUTCMonth()+"-"+d.getUTCFullYear();
}
}
});
</script>
</body>
</html>
0 comments:
Post a Comment