博客地址 ：https://www.cnblogs.com/sandraryan/

声明式的渲染,以{{}}的形式调用数据





<!DOCTYPE html>


<html lang="en">


<head>


    <meta charset="UTF-8">


    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <meta http-equiv="X-UA-Compatible" content="ie=edge">


    <title>介绍vue</title>


</head>


<body>


    <div id="app">


        <!-- vue是声明式的渲染，用双大括号调用,data中的数据会被通过双花括号调用 -->


        <p>{{num}}</p>


        <!-- 标签内也可以写表达式,num大于10 显示10，否则显示num -->


        <p>{{ num > 10 ? 10 : num}}</p>


        <p>{{ num || 'you'}}</p>


        <!-- v-html 指令渲染 会被解析为自定义属性-->


        <p v-html = 'num'></p>


        <p v-if = 'num ===2'>if</p>


        <p v-else>else</p>


        <!--    v-if 控制要不要创建这个节点，v-show控制要不要显示这个节点 display : none-->


        <!-- else和if 会自动互斥，else 会自动match最近的if -->


        <p v-else>another else</p>


        <p v-show = 'true'>23333</p>


        <p v-show = 'false'>404</p>


    </div>


    <!-- 在#app中的内容才会被承认vue语法，没有连接到vue原型 -->


    <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>


    <script>


    const app = new Vue({


        el : '#app',


        data : {


            num: 


        }


    });


    </script>


</body>


</html>




												


											
vue2——指令渲染，{{}}渲染的更多相关文章
	

    
						
  1. Vue2服务端渲染
		
    Vue2 服务端渲染 花费了一个月时间,终于在新养车之家项目中成功部署了vue2服务端渲染(SSR),并且使用上了Vuex 负责状态管理,首屏加载时间从之前4G网络下的1000ms,提升到了现在500 ...
    
		
    2. 
								
  2. angular中关于自定义指令——repeat渲染完成后执行动作
		
    业务中有时需要在异步获取数据并用ng-repeat遍历渲染完页面后执行某个操作,angular本身并没有提供监听ng-repeat渲染完成的指令,所以需要自己动手写.有经验的同学都应该知道,在ng-r ...
    
		
    3. 
						
  3. WebGL的颜色渲染-渲染一张DEM(数字高程模型)
		
    目录 1. 具体实例 2. 解决方案 1) DEM数据.XYZ文件 2) showDEM.html 3) showDEM.js 4) 运行结果 3. 详细讲解 1) 读取文件 2) 绘制函数 3) 使 ...
    
		
    4. 
						
  4. layui下拉框数据过万渲染渲染问题解决方案
		
    方案一:layui下拉框分页插件 https://fly.layui.com/jie/29002/ 此插件我用了下浏览器缓存有问题,而且当下拉框数据量过万后,会一直渲染不出来,期待后期作者优化 如图下 ...
    
		
    5. 
						
  5. 如何使用Vue2做服务端渲染
		
    花费了一个月时间,终于在新养车之家项目中成功部署了vue2服务端渲染(SSR),并且使用上了Vuex 负责状态管理,首屏加载时间从之前4G网络下的1000ms,提升到了现在500-700ms之间,SS ...
    
		
    6. 
						
  6. CSharpGL(34)以从零编写一个KleinBottle渲染器为例学习如何使用CSharpGL
		
    CSharpGL(34)以从零编写一个KleinBottle渲染器为例学习如何使用CSharpGL +BIT祝威+悄悄在此留下版了个权的信息说: 开始 本文用step by step的方式,讲述如何使 ...
    
		
    7. 
						
  7. Unity渲染优化中文翻译（一）——定位渲染问题
		
    最近有一点个人的时间,尝试一下自己翻译一下英文的 Optimizing graphics rendering in Unity Games, 这儿附上英文链接: 个人英文水平有限,unity图像学知识 ...
    
		
    8. 
						
  8. vue笔记-条件渲染
		
    条件渲染 1:指令v-if单独使用和结合v-else //单独使用 <h1 v-if="ok">Yes</h1> //组合使用 <h1 v-if=&q ...
    
		
    9. 
						
  9. 从vue渲染想到的数组方法
		
    <div id="app"> <ul> <li v-for='item in goods'>{{item}}</li> </u ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. update当根据条件不同时 更新同一个字段的方法   或多表插入
			
    1.通过存储过程 循环 传值 create or replace procedure p_u isbegin for rs in (select distinct (rks) from rkbz)lo ...
    
			
    2. 
						
  2. bzoj3064/洛谷P4314 CPU监控【线段树】
			
    好,长草博客被催更了[?] 我感觉这题完全可以当作线段树3 线段树2考加法和乘法标记的下放顺序,这道题更丧心病狂[?] 很多人可能跟我一样,刚看到这道题秒出思路:打一个当前最大值一个历史最大值不就完事 ...
    
			
    3. 
						
  3. iOS 动画队列—仿映客刷礼物效果
			
    http://www.cocoachina.com/ios/20160719/17101.html 最近在研究直播的相关知识,在网上看到了不少优秀的开源项目,但都没有看到映客那个刷礼物的效果,于是手痒 ...
    
			
    4. 
						
  4. NOIP模拟17.10.12
			
    T1 临江仙 旧梦 题目背景 闻道故园花陌,今年奼紫嫣红.扬帆直渡水千重.东君何解意,送我一江风. 还是昔时庭院,终得醉卧花丛.残更惊醒月明中.流光如旧岁,多少梦成空. 题目描述 #define go ...
    
			
    5. 
						
  5. 使用mybatis的延迟加载
			
    在某些情况下我们需要使用延迟加载技术来提高我们程序查询的性能,通过减少与数据库的连接操作,做到按需加载,这样达到提高程序性能的目的. 首先需要在全局配置文件(SqlMapConfig.xml)中配置全 ...
    
			
    6. 
						
  6. win10 请求操作需要提升解决方案
			
    记录一下: win10   系统管理员 打开后缀为  .xxx 的文件时, 系统提示: 请求操作需要提升 网上搜索了一下,原因是权限不够,故系统提示. 给当前用户加入了 管理员权限,各种权限都无效.  ...
    
			
    7. 
						
  7. ACdream 1101　线段树
			
    题目链接 瑶瑶想要玩滑梯 Time Limit: 10000/5000MS (Java/Others)Memory Limit: 512000/256000KB (Java/Others) Submi ...
    
			
    8. 
						
  8. C# 配置文件 Appconfig
			
    WinForm或WPF应用程序有时候需要保存用户的一些配置就要用到配置文件,而微软为我们的应用程序提供了Application Configuration File,就是应用程序配置文件,可以很方便的 ...
    
			
    9. 
						
  9. 使用Gradle构建项目
			
    使用gradle构建项目之前,咱们先聊聊maven,使用maven构建项目和配置主要 接下来正式使用gradle来构建项目的和步骤: 1.下载源码 2.下载gradle 1.下载地址:https:// ...
    
			
    10. 
						
  10. 面试问题：Vuejs如何实现双向绑定
			
    最近出去面试,栽在这个问题上,提到vuejs,面试官一般会让你说vuejs的特点,一般就要回答virtual dom tree, dom tree diff, 以及数据双向绑定,然后面试官会追问你,v ...
    
			
    11.