vue学习02-v-text

  1. 引入环境版本，cdn网络引用或者本地js应用
  2. html的结构，一般是div
  3. 创建vue实例
  4. el:挂载点
  5. v-text指令的作用是设置标签的内容
  6. 默认写法会替换全部内容，使用差值表达式{{}}可以替换指定内容
<!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>Document</title>

</head>

<!-- 开发环境版本-->

<script src="js/vue.js"></script>

<body>

    <div id="app">

        <h2 v-text="message+'我'+info"></h2>

        <h2 v-text="info"></h2>

        <h1>帅比{{message}}</h1>

    </div>

    <script>

        var app = new Vue({

            el:"#app",

            data: {

                message: "小飞，你好！",

                info: "正在前端学习！"

            }

        })

    </script>

</body>

</html>

效果图：

vue学习02-v-text的更多相关文章

  1. vue学习02

    圆中圆: father: padding:6px width:56px height:56px border-radius:50% box-sizing:border-box son: width:1 ...

  2. [前端学习]vue的指令学习记录 vu-if | text | for | on | model | bind | pre

    vue的指令学习记录 vue-if | text | for | on | model - 目录 vue的指令学习记录 vue-if | text | for | on | model ... 预备 ...

  3. Vue学习笔记-1

    前言 本文不是Vue.js的教程,只是一边看官网Vue的教程文档一边记录并总结学习过程中遇到的一些问题和思考的笔记. 1.vue和avalon一样,都不支持VM初始时不存在的属性 而在Angular里 ...

  4. day 81 Vue学习一之vue初识

      Vue学习一之vue初识   本节目录 一 Vue初识 二 ES6的基本语法 三 Vue的基本用法 四 xxx 五 xxx 六 xxx 七 xxx 八 xxx 一 vue初识 vue称为渐进式js ...

  5. Vue学习笔记十三：Vue+Bootstrap+vue-resource从接口获取数据库数据

    目录 前言 SpringBoot提供后端接口 Entity类 JPA操作接口 配置文件 数据库表自动映射,添加数据 写提供数据的接口 跨域问题 前端修改 效果图 待续 前言 Vue学习笔记九的列表案例 ...

  6. day 80 Vue学习一之vue初识

    Vue学习一之vue初识   本节目录 一 Vue初识 二 ES6的基本语法 三 Vue的基本用法 四 xxx 五 xxx 六 xxx 七 xxx 八 xxx 一 vue初识 vue称为渐进式js框架 ...

  7. Vue学习笔记-Vue.js-2.X 学习(一)===>基本知识学习

    一  使用环境: windows 7 64位操作系统 二  IDE:VSCode/PyCharm 三  Vue.js官网: https://cn.vuejs.org/ 四  下载安装引用 方式1:直接 ...

  8. JavaScript学习02 基础语法

    JavaScript学习02 基础语法 JavaScript中很多基础内容和Java中大体上基本一样,所以不需要再单独重复讲了,包括: 各种算术运算符.比较运算符.逻辑运算符: if else语句.s ...

  9. Java学习02

    Java学习02 1.导入内部的包 一.在包的下面加入下面一句话: import    java.util.Scanner; 二.在类中 Scanner input=new     Sanner(Sy ...

  10. ThinkPhp学习02

    原文:ThinkPhp学习02 一.什么是MVC                M -Model 编写model类 对数据进行操作 V -View  编写html文件,页面呈现 C -Controll ...

随机推荐

  1. 如何获取东方财富文华新浪财经实时行情数据API接口

    BIGI行情期货外汇股指A股期权实时行情数据文华新浪财经API接口新浪财经并非实时行情数据源,所以获取的行情数据源也并非实时的.以下介绍的方法和新浪财经获取行情数据源的方法是一致的.需要实时行情数据源 ...

  2. Advances and Open Problems in Federated Learning

    挖个大坑,等有空了再回来填.心心念念的大综述呀(吐血三升)! 郑重声明:原文参见标题,如有侵权,请联系作者,将会撤销发布! 项目地址:https://github.com/open-intellige ...

  3. 「从零单排canal 07」 parser模块源码解析

    基于1.1.5-alpha版本,具体源码笔记可以参考我的github:https://github.com/saigu/JavaKnowledgeGraph/tree/master/code_read ...

  4. Java数据结构——红黑树

    红黑树介绍红黑树(Red-Black Tree),它一种特殊的二叉查找树.执行查找.插入.删除等操作的时间复杂度为O(logn). 红黑树是特殊的二叉查找树,意味着它满足二叉查找树的特征:任意一个节点 ...

  5. Java——注解

    注解的产生背景以前,xml以低耦合的方式得到了广大开发者的青睐,xml在当时基本上能完成框架中的所有配置.但是随着项目越来越庞大,xml的配置也越来越复杂,维护性也随之降低,维护成本增高.于是就产生了 ...

  6. Node.js小项目——学生信息管理系统

    这是迄今为止第一次接触后端的东西,是一个很小的项目,但是对于前端学习入门很好.我是先学了VUE框架再学的Node,学起来比较轻松,不过每个人都有自己的学习方法️ 一.项目描述 学生信息管理系统,可以实 ...

  7. Docker 之常见应用部署

    本文教大家如何将常见的应用使用 Docker 进行部署,巩固大家 Docker 命令的学习,下文教大家如何构建属于我们自己的 Docker 镜像. Tomcat 拉取镜像. docker pull t ...

  8. Python测试函数运行时间

    import time import datetime # 测试函数运行时间 def cal_time(fn): """计算性能的修饰器""" ...

  9. C++入门记-大纲

    缘来 由于某个不可告人的目标以及想趁着还有精力的年龄,开始了C++学习之路.C++ 诞生很多年了,但依然具有强大的生命力. 我们来看下2020年8月TIOBE 8 月编程语言排行榜. 可以看到C以及C ...

  10. openCV - 3. Mat对象

    Mat对象与IplImage对象.Mat对象使用.Mat定义数组 Mat对象与IplImage对象 Mat对象OpenCV2.0之后引进的图像数据结构.自动分配内存.不存在内存泄漏的问题,是面向对象的 ...