#变量和字符串的拼接#

写项目中,遇到了这样的一个问题:怎样在一个div里面显示两个data中的数据?我的问题描述清楚了吗。。。

看图吧:

  这是用户最初的需求~

 这是用户后来的需求,嗯……就是多了个文件的总数量~

最初代码:

data() {
return{
banner[
{id: ,name: "全部文件"},
{id: ,name: "招生简介"},
{id: ,name: "其他文件"}
]
}
}

后期代码:

data() {
return{
banner[
{id: 0,name: ""},
{id: 0,name: ""},
{id: 0,name: ""}
],
     //这里我只是随意写了个数值,具体值,当然是从后台传过来的呀~
allFilesCount:1000,
recrIntroCount:200,
otherFilesCount:7000
}
},
methods:{
//变量和字符串拼接的方法
adds:function() {
    //``这个符号需要注意,英文状态下,Esc下面那个键。
    this.banner[0].name = `全部文件(${this.allFilesCount})`;
    this.banner[1].name = `招生简介(${this.recrIntroCount})`;
    this.banner[2].name = `其他文件(${this.otherFilesCount})`;
  }
},
mounted() { 
  this.adds();//最后,调用一下上面那个赋值的方法
}

  

vue—data中变量和字符串拼接的更多相关文章

  1. vue 在模板template中变量和字符串拼接

    例子:  :post-action="'/api/v1/reportPage/'+this.selectedPagerId+'/saveimg/'"

  2. 为什么阿里巴巴不建议在for循环中使用"+"进行字符串拼接

    字符串,是Java中最常用的一个数据类型了.关于字符串的知识,作者已经发表过几篇文章介绍过很多,如: Java 7 源码学习系列(一)--String 该如何创建字符串,使用" " ...

  3. 含变量的字符串拼接(string.Format()或$"")

    含变量的字符串拼接,一般不要用 + 来连接字符串,可用以下两种方式: 一.string.Format() 二.$""  (在C#6以上的版本中可用,推荐这种写法) 1 public ...

  4. 不建议在for循环中使用”+”进行字符串拼接

    https://mp.weixin.qq.com/s/qG6bdhndAip9s-_XM9oP3A 为什么阿里巴巴不建议在for循环中使用”+”进行字符串拼接 互联网后端架构 1周前    

  5. SQL Server解惑——为什么ORDER BY改变了变量的字符串拼接结果

      在SQL Server中可能有这样的拼接字符串需求,需要将查询出来的一列拼接成字符串,如下案例所示,我们需要将AddressID <=10的AddressLine1拼接起来,分隔符为|.如下 ...

  6. 阿里巴巴Java开发手册_不建议在循环体中使用+进行字符串拼接

    18. [推荐]循环体内,字符串的连接方式,使用StringBuilder的append方法进行扩展. 说明:下例中,反编译出的字节码文件显示每次循环都会new出一个StringBuilder对象,然 ...

  7. 为什么阿里巴巴Java开发手册中不建议在循环体中使用+进行字符串拼接?

    之前在阅读<阿里巴巴Java开发手册>时,发现有一条是关于循环体中字符串拼接的建议,具体内容如下: 那么我们首先来用例子来看看在循环体中用 + 或者用 StringBuilder 进行字符 ...

  8. vue data中的对象的属性如何使用watch监听

    在写项目的时候遇到了一个问题,就是需要动态监听data中一个对象的属性的变化.遇到了许多坑,在此过程中也发现了两种解决方案. 一.通过deep属性实现 data() { return { parent ...

  9. js中定义用字符串拼接起来的变量名的变量

    用对象的形式 你的问题可以通过js的对象实现 var ovar = {}; for(var i=0;i<10;i++){ ovar['var_'+i]=''; } 3用数组的形式 var arr ...

随机推荐

  1. 分析Linux内核5.0系统调用处理过程

    学号: 363 本实验来源 https://github.com/mengning/linuxkernel/ 一.实验要求 1.编译内核5.02.qemu -kernel linux-5.0.1/ar ...

  2. PDF 补丁丁 0.6.0.3413 版发布(修复提取图片问题,增加自动检查软件更新功能)

    新的测试版修复了提取图片旋转方向错误.遇到格式错误的图片后无法继续提取的问题. 另外增加了自动检查软件版本更新的功能(该功能不上传关于用户的任何个人信息,仅向本博客请求静态的版本信息文件,可在“帮助- ...

  3. 上海MVP见面会

    很愉快,很有收获的一次见面!

  4. js检测页面离开

    window.location = 'yjk://app.h5.ihaozhuo.com?page=livetrailer&videoLiveId=' + parseInt(this.Requ ...

  5. windows下Go升级及GoLand的安装激活

    之前在qor/China上问golang项目包有没有一键安装,有位朋友给出了回复: 于是,尝试了下升级Go,目前版本是1.10.1,现升级为为1.12.2.步骤如下: 一.下载安装包 下载地址:htt ...

  6. MySQL数据库SQL语句基本操作

    一.用户管理: 创建用户: create user '用户名'@'IP地址' identified by '密码'; 删除用户: drop user '用户名'@'IP地址'; 修改用户: renam ...

  7. python threading模块中的join()方法和setDeamon()方法的一些理解

    之前用多线程的时候看见了很多文章,比较常用的大概就是join()和setDeamon()了. 先说一下自己对join()的理解吧: def join(self, timeout=None): &quo ...

  8. springboot+mybatis+thymeleaf项目搭建及前后端交互

    前言 spring boot简化了spring的开发, 开发人员在开发过程中省去了大量的配置, 方便开发人员后期维护. 使用spring boot可以快速的开发出restful风格微服务架构. 本文将 ...

  9. DevExpress VCL Controls 2019发展路线图(No.2)

    [DevExpress VCL Controls下载] ExpressQuantumTreeList Excel-inspired Filter (v19.1) 与ExpressQuantumGrid ...

  10. JAVA 平时作业一

    public class Print { public static void main (String arg[]) { for(int i=0;i<16;i++) { for(int j=0 ...