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原生封装的 ...
随机推荐
- Jquery 获取所有对象的第一个子元素
转自:http://blog.sina.com.cn/s/blog_5fdbd0410100pmnn.html <ul> <li>John</li> <l ...
- python 基础之第十二天（re正则，socket模块）
In [14]: 'hello-wold.tar.gz'.split('.') Out[14]: ['hello-wold', 'tar', 'gz'] In [15]: import re In [ ...
- [HAOI 2012] 容易题
[题目链接] https://www.lydsy.com/JudgeOnline/problem.php?id=2751 [算法] 考虑k = 0的情况 , 根据乘法原理 : Ans = (n * ( ...
- 关于yolo 模型中１Ｘ１卷积层的作用
1X1卷积层的作用: 1.实现跨通道的交互和信息整合.2.进行卷积核通道数的降维和升维.3.就是可以在保持feature map 尺寸不变(即不损失分辨率)的前提下大幅增加非线性特性,把网络做得很de ...
- heartbeat3.x部署安装
使用Heartbeat构建Linux双机热备系统 本文档版本号: V1.0 版 本 历 史 版本号 更新时间 说 明 创建者 V1.0 2013-3-23 修改版 金桥 1 部署环境 OS: Red ...
- dubbo 学习笔记 -- provider端
服务端的配置文件: provider.xml <?xml version="1.0" encoding="UTF-8"?> <beans ...
- 3.15-3.21 hive项目实战
一.创建表并导入日志数据,引出问题 ##建表 hive (default)> create table IF NOT EXISTS default.bf_log_src( > remote ...
- TypeScript完全解读(26课时)_4.TypeScript完全解读-接口
4.TypeScript完全解读-接口 初始化tslint tslint --init:初始化完成后会生成tslint.json的文件 如果我们涉及到一些规则都会在这个rules里面进行配置 安装ts ...
- 挨踢职场求生法则-----我在IT职场打滚超过15年了，从小小的程序员做到常务副总
摘要我在IT职场打滚超过15年了,从小小的程序员做到常务副总.相对于其它行业,IT职场应该算比较光明的了,但也陷阱重重,本文说说我的亲身体会,希望大家能在IT职场上战无不胜! 通用法则 法则1:忍耐是 ...
- SourceTree配置BeyondCompare代码冲突解决工具
一.工具准备:SourceTree这个你得有.然后下载BeyondCompare(破解教程) 二.配置环境:SourceTree->工具->选项->比较,外部对比工具和合并工具都选择 ...