#变量和字符串的拼接#

写项目中,遇到了这样的一个问题:怎样在一个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. 【技巧】easyUI的datagrid,如何在翻页以后仍能记录被选中的行

    easyUI的datagrid在复选框多选时,如何在翻页以后仍能记录被选中的行: 注意datagrid中需要配置idField属性,一般为数据的主键

  2. ES5原型琏继承

    function add(){}; add.prototype.showName = "MAN";add.prototype.name = function(){ console. ...

  3. 10ci

  4. 【webpack学习笔记】a01-基础构建

    webpack基于nodejs环境运行,首先确认已经安装了node.js. 基础构建流程 新建一个文件夹,这个就是你项目的根目录. 在命令行中使用npm init命令初始化npm,会得到一个 ==pa ...

  5. 软工作业(JAVA)

    github传送门:https://github.com/hhg52516/WC.git 项目要求 wc.exe 是一个常见的工具,它能统计文本文件的字符数.单词数和行数.这个项目要求写一个命令行程序 ...

  6. docker学习常用指令---第五章节

    前面我们了解了docker的基本概念,和docker镜像,端口相关的内容.在具体的实际操作过程中,我们需要了解一些相关的docker操作指令. 一.Docker save指令 指令功能:将指定镜像保存 ...

  7. Vue源码之 Vue的生命周期

    天地初开就是new Vue(options),里面就一句话 this._init(options); (Vue.prototype.init 的赋值在initMixin(Vue)方法里) _init方 ...

  8. 问题1:Oracle数据库监听启动失败(重启监听,提示The listener supports no services)

    编辑监听文件:/home/DB/oracle/11gR2/db/network/admin/listener.ora 在文件内添加静态监听实例,如下内容: SID_LIST_LISTENER =(SI ...

  9. Beta冲刺 5

    前言 队名:拖鞋旅游队 组长博客:https://www.cnblogs.com/Sulumer/p/10129059.html 作业博客:https://edu.cnblogs.com/campus ...

  10. soapui 测试 带hear 验证的写法

    <soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:web=& ...