Vue 简单实用---代码可以直接用
<!DOCTYPE html>
<html> <head>
<title></title>
<script src="https://unpkg.com/vue"></script>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
var app = new Vue({
el: '#app1',
data: {
message: "Hello Hu"
} });
app1 = new Vue({
el: "#app-2",
data: {
message: "Now is" + new Date().toLocaleString()
}
});
app3 = new Vue({
el: "#app-3",
data: {
seen: true
}
});
Vue.component('todo-item', {
props: ['todo'],
template: '<li>{{ todo.text }}</li>'
})
var app7 = new Vue({
el: '#app-7',
data: {
groceryList: [
{ id: 0, text: '蔬菜' },
{ id: 1, text: '奶酪' },
{ id: 2, text: '随便其他什么人吃的东西' }
]
}
})
});
</script>
</head> <body>
<div id="app1">
<p>{{ message }}</p>
</div>
<div id="app-2">
<span v-bind:title="message">
看看时间
</span>
</div>
<div id="app-3">
<div>
<p v-if="seen">你看到我了</p>
</div>
</div>
<ol>
<todo-item></todo-item>
</ol>
<div id="app-7">
<ol>
<todo-item v-for="item in groceryList" v-bind:todo="item" v-bind:key="item.id">
</todo-item>
</ol>
</div>
</body> </html>
Vue 简单实用---代码可以直接用的更多相关文章
- vue简单实例代码
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...
- 经验分享：10个简单实用的 jQuery 代码片段
尽管各种 JavaScirpt 框架和库层出不穷,jQuery 仍然是 Web 前端开发中最常用的工具库.今天,向大家分享我觉得在网站开发中10个简单实用的 jQuery 代码片段. 您可能感兴趣的相 ...
- 10个简单实用的 jQuery 代码片段
尽管各种 JavaScirpt 框架和库层出不穷,jQuery 仍然是 Web 前端开发中最常用的工具库. 今天,向大家分享我觉得在网站开发中10个简单实用的 jQuery 代码片段. 1.平滑滚动到 ...
- 简单实用的HTML代码
简单实用的HTML代码 一.HTML各种命令的代码: 1.文本标签(命令) <pre></pre> 创建预格式化文本 <h1></h1> 创建最大的标题 ...
- C#反射实现 C# 反射 判断类的延伸类型 使用代码生成工具Database2Sharp快速生成工作流模块控制器和视图代码 C# ADO.NET的SqlDataReader对象,判断是否包含指定字段 页面中添加锚点的几种方式 .net 简单实用Log4net（多个日志配置文件） C# 常用小点
C#反射实现 一.反射概念: 1.概念: 反射,通俗的讲就是我们在只知道一个对象的内部而不了解内部结构的情况下,通过反射这个技术可以使我们明确这个对象的内部实现. 在.NET中,反射是重要的机制, ...
- 简单实用的php分页函数代码
一个简单实用的php分页函数,分页导航中可以默认为空,在函数内部再设置本页URL. 代码: <?php /** * 分页 * @category 功能 * @param $totle:信息总数 ...
- 这两天老是有兄弟问到Vue的登陆和注册，登陆成功留在首页，没有登录回到登录页面，现在我用最简单实用的方法实现（两分钟技就看懂）
其实登录注册,并且登录一次保持登录的状态,是每个项目都需要实现的功能. 网上也有很多的方法,不过,不是通俗易懂,在这里说一下我自己的方法,非常简单实用核心就是用localStorage存.取数据,这样 ...
- vue的技巧代码
转载:https://segmentfault.com/a/1190000014085613 第一招:化繁为简的Watchers 场景还原: created(){ this.fetchPostList ...
- VUE基础实用技巧
Vue以前听说过,有了解过一点.当时还在热衷于原生JavaScript去写一些方法的封装,不是为啥,就感觉这样很帅,后面多多少少接触了一些JQuery的用法,到现在为止,JavaScript原生封装的 ...
随机推荐
- DDD领域驱动之干货(二)
基于仓储的实现 1.前言:本着第一节写的有些糊涂,主要是自己喜欢实干,不太喜欢用文字表述,就这样吧.下面切入正题. 博客园里面有很多的大佬,我这里就不一一解释概览,有兴趣的朋友可以去看大佬们写的 ...
- bootstrap 学习笔记（3）---- 代码
这节讲的是代码: 1.基本实例 <code></code> <pre></pre> <kbd></kbd> 应用如下 1.Fo ...
- EntityFrameWork Parameter '@columnType' must be defined.
环境: EntityFrameWork CodeFirst+MySql 今天在提交一个外键字段的修改时报“Parameter '@columnType' must be defined.” goog ...
- linux命令：wc命令
Linux系统中的wc(Word Count)命令的功能为统计指定文件中的字节数.字数.行数,并将统计结果显示输出. 1．命令格式: wc [选项]文件... 2．命令功能: 统计指定文件中的字节数. ...
- C# 计算时间日期
System.DateTime datetime = System.DateTime.Now.AddSeconds(fixtime); // fixtime 是往后的秒数 : datetime是现在时 ...
- （转）data Table的用法大全
jqyery dataTable 基本用法 一:官方网站:[http://www.datatables.net/] 二:基本使用:[http://www.guoxk.com/node/jquery-d ...
- nohup不输出日志信息的方法及linux重定向
最近使用nohup创建了一个后台进程,默认日志输出到了nohup.out文件中,程序跑起来也就没再管,过了大约一周,发现硬盘空间不够了,于是查找原因,发现这个nohup.out文件已经到了70G了,导 ...
- C - Present
C - Present Time Limit:2000MS Memory Limit:262144KB 64bit IO Format:%I64d & %I64u Submit ...
- Markdown编写github README.md
Markdown编写github README.md 一.在线编辑器StackEdit Markdown在线编辑器地址 中文:https://www.zybuluo.com/mdeditor 英文:h ...
- tinyxml一些应注意的问题
今天在对使用tinyxml库的程序调试的时候,出现的一些问题让人很纠结,特记以此... 在对TixmlDocument创建时我是用new创建的,然后在用完之后我用delete释放掉,可是用gdb调试 ...