#变量和字符串的拼接#

写项目中,遇到了这样的一个问题:怎样在一个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. Spring Boot 小技巧

    初始化数据 我们在做测试的时候经常需要初始化导入一些数据,如何来处理呢?会有两种选择,一种是使用 Jpa,另外一种是 Spring JDBC .两种方式各有区别下面来详细介绍. 使用 Jpa 在使用s ...

  2. PhoneGap和Cordova应该用哪一个?

    就目前来看,cordova是一个移动应用开发框架,你基于这个东西可以用网页代码作出APP.Phonegap Build是一个在线打包工具,你把使用cordova写好的项目给Phonegap Build ...

  3. 【转载】安装 gephi 软件

    作者:小小爽链接:https://www.zhihu.com/question/21268129/answer/354924066来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注 ...

  4. 最新的 cocoapods 安装与使用(2019.04)

    cocoapods简介: cocoapods 是iOS的类库管理工具,可以让开发者很方便集成各种第三方库,而不用去网站上一个个下载,再一个个文件夹的拖进项目中,还得添加相关的系统依赖库.只需要安装好c ...

  5. java AQS(AbstractQueuedSynchronizer)同步器详解

    除了内置锁(synchronized)外,java AQS(AbstractQueuedSynchronizer)同步器几乎是所有同步容器,同步工具类的基础.ReentrantLock.Reentra ...

  6. leetcode python 033 旋转数组查找

    ## 假设升序,import random def find(y):    l,m=len(y),0    while l>1:        n=int(l/2)        if y[0] ...

  7. kaliLinux 安装 telnet

    一.安装xinetd telnetd root@helm:~# apt-get install xinetd telnetd 二.查看服务是否启动状态 说明自启动了 如果没有需要启动xinetd,启动 ...

  8. WebApi--------找到了与该请求匹配的多个操作问题解决

    错误信息: {"Message": "出现错误.","ExceptionMessage": "找到了与该请求匹配的多个操作: \r ...

  9. python之django母板页面

    其实就是利用{% block xxx %}   {% endblock %}的方式定义一个块,相当于占位.存放在某个html中,比如base.html 然后在需要实现这些块的文件中,使用继承{% ex ...

  10. CSS grid 模板

    在gridCSS属性速记属性显式设置所有的网格性质(grid-template-rows,grid-template-columns,和grid-template-areas和所有的网格性质(隐式gr ...