vue—data中变量和字符串拼接
#变量和字符串的拼接#
写项目中,遇到了这样的一个问题:怎样在一个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中变量和字符串拼接的更多相关文章
- vue 在模板template中变量和字符串拼接
例子: :post-action="'/api/v1/reportPage/'+this.selectedPagerId+'/saveimg/'"
- 为什么阿里巴巴不建议在for循环中使用"+"进行字符串拼接
字符串,是Java中最常用的一个数据类型了.关于字符串的知识,作者已经发表过几篇文章介绍过很多,如: Java 7 源码学习系列(一)--String 该如何创建字符串,使用" " ...
- 含变量的字符串拼接(string.Format()或$"")
含变量的字符串拼接,一般不要用 + 来连接字符串,可用以下两种方式: 一.string.Format() 二.$"" (在C#6以上的版本中可用,推荐这种写法) 1 public ...
- 不建议在for循环中使用”+”进行字符串拼接
https://mp.weixin.qq.com/s/qG6bdhndAip9s-_XM9oP3A 为什么阿里巴巴不建议在for循环中使用”+”进行字符串拼接 互联网后端架构 1周前
- SQL Server解惑——为什么ORDER BY改变了变量的字符串拼接结果
在SQL Server中可能有这样的拼接字符串需求,需要将查询出来的一列拼接成字符串,如下案例所示,我们需要将AddressID <=10的AddressLine1拼接起来,分隔符为|.如下 ...
- 阿里巴巴Java开发手册_不建议在循环体中使用+进行字符串拼接
18. [推荐]循环体内,字符串的连接方式,使用StringBuilder的append方法进行扩展. 说明:下例中,反编译出的字节码文件显示每次循环都会new出一个StringBuilder对象,然 ...
- 为什么阿里巴巴Java开发手册中不建议在循环体中使用+进行字符串拼接?
之前在阅读<阿里巴巴Java开发手册>时,发现有一条是关于循环体中字符串拼接的建议,具体内容如下: 那么我们首先来用例子来看看在循环体中用 + 或者用 StringBuilder 进行字符 ...
- vue data中的对象的属性如何使用watch监听
在写项目的时候遇到了一个问题,就是需要动态监听data中一个对象的属性的变化.遇到了许多坑,在此过程中也发现了两种解决方案. 一.通过deep属性实现 data() { return { parent ...
- js中定义用字符串拼接起来的变量名的变量
用对象的形式 你的问题可以通过js的对象实现 var ovar = {}; for(var i=0;i<10;i++){ ovar['var_'+i]=''; } 3用数组的形式 var arr ...
随机推荐
- 【技巧】easyUI的datagrid,如何在翻页以后仍能记录被选中的行
easyUI的datagrid在复选框多选时,如何在翻页以后仍能记录被选中的行: 注意datagrid中需要配置idField属性,一般为数据的主键
- ES5原型琏继承
function add(){}; add.prototype.showName = "MAN";add.prototype.name = function(){ console. ...
- 10ci
- 【webpack学习笔记】a01-基础构建
webpack基于nodejs环境运行,首先确认已经安装了node.js. 基础构建流程 新建一个文件夹,这个就是你项目的根目录. 在命令行中使用npm init命令初始化npm,会得到一个 ==pa ...
- 软工作业(JAVA)
github传送门:https://github.com/hhg52516/WC.git 项目要求 wc.exe 是一个常见的工具,它能统计文本文件的字符数.单词数和行数.这个项目要求写一个命令行程序 ...
- docker学习常用指令---第五章节
前面我们了解了docker的基本概念,和docker镜像,端口相关的内容.在具体的实际操作过程中,我们需要了解一些相关的docker操作指令. 一.Docker save指令 指令功能:将指定镜像保存 ...
- Vue源码之 Vue的生命周期
天地初开就是new Vue(options),里面就一句话 this._init(options); (Vue.prototype.init 的赋值在initMixin(Vue)方法里) _init方 ...
- 问题1:Oracle数据库监听启动失败(重启监听,提示The listener supports no services)
编辑监听文件:/home/DB/oracle/11gR2/db/network/admin/listener.ora 在文件内添加静态监听实例,如下内容: SID_LIST_LISTENER =(SI ...
- Beta冲刺 5
前言 队名:拖鞋旅游队 组长博客:https://www.cnblogs.com/Sulumer/p/10129059.html 作业博客:https://edu.cnblogs.com/campus ...
- soapui 测试 带hear 验证的写法
<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:web=& ...