其原理,是利用vue里的computed计算属性来做。

请看代码:

<div id='app'>
<div v-text="newUsers"></div>
</div> new Vue({
el:'#app',
data:{
arrObj:{
name:"宋宇",
age:"1999",
sex:"??"
}
},
computed: {
newUsers: function () {
var that = this;
var user=that.arrObj;
return user.name+','+user.age+','+user.sex
}
}
})

所以说,vue真的很强大,很方便,就看脑洞有多大了。其实,换个姿势,我还可以来一遍。

vue之v-text渲染多值的更多相关文章

  1. 理解Vue中的Render渲染函数

    理解Vue中的Render渲染函数 VUE一般使用template来创建HTML,然后在有的时候,我们需要使用javascript来创建html,这时候我们需要使用render函数.比如如下我想要实现 ...

  2. Vue为何采用异步渲染

    Vue为何采用异步渲染 Vue在更新DOM时是异步执行的,只要侦听到数据变化,Vue将开启一个队列,并缓冲在同一事件循环中发生的所有数据变更,如果同一个watcher被多次触发,只会被推入到队列中一次 ...

  3. Vue学习之--------列表渲染、v-for中key的原理、列表过滤的实现(2022/7/13)

    文章目录 1.基本列表 1.1 基本知识 1.2 代码实例 1.3 测试效果 2.key的原理 2.1基本知识 2.2 代码实例 2.3 测试效果 2.4 原理图解 3.列表过滤 3.1 代码实例 3 ...

  4. ASP.NET Core 与 Vue.js 服务端渲染

    http://mgyongyosi.com/2016/Vuejs-server-side-rendering-with-aspnet-core/ 原作者:Mihály Gyöngyösi 译者:oop ...

  5. vue中的页面渲染方案

    一.模板渲染 <div id="J_render_app"> <ul v-if="items.length"> <li v-for ...

  6. NET Core 与 Vue.js 服务端渲染

    NET Core 与 Vue.js 服务端渲染 http://mgyongyosi.com/2016/Vuejs-server-side-rendering-with-aspnet-core/原作者: ...

  7. vue 数组和对象渲染问题

    vue 数组和对象渲染问题 最近项目有点忙碌,遇到好多问题都没有总结(╥﹏╥),在开发过程中,取vuex中的数组渲染完成之后,再次修改数组的值,数据更新了,但是视图并没有更新.以为是数组更新的问题,后 ...

  8. Vue组件v-if新渲染的组件不更新

    Vue组件v-if新渲染的组件不更新:可能原因是Vue识别到是相似组件(高度相似甚至相同)不会更新元素.给原来的组件和新组件分别给不同的key值让Vue识别为不同的组件.

  9. vue的v-for循环渲染列表时,解决没有:key警告问题(:key的作用)

    :key是为vue的响应式渲染提供方法,在列表中单条数据改变的情况下,可以进行单独渲染,减少页面资源消耗. 当前页面如果有列表渲染v-for,并且在v-for的循环标签中没有:key元素时,控制台会出 ...

  10. vue强制组件重新渲染

    有时候,依赖 Vue 响应方式来更新数据是不够的,相反,我们需要手动重新渲染组件来更新数据.或者,我们可能只想抛开当前的DOM,重新开始.那么,如何让Vue以正确的方式重新呈现组件呢? 强制 Vue ...

随机推荐

  1. CCPC-Winter Camp div2 day8 A

    ---恢复内容开始--- 题目: 题解: 我们考虑第i个叶子节点的情况,根据题目给的输入条件,我们可以知道,深度大的节点的序号一定是大于深度浅的节点的序号的 如图 题目要求我们找出每一个叶子节点距离编 ...

  2. 前端PHP入门-001-为什么学习PHP?

    写在前面的话 可能不知道能坚持多久,现在的我喜欢纯文字的描述! 希望能坚持写完,也是对自己的一个鞭策! 总顾及别人,那谁来顾及你! 为什么学习PHP? PHP入门简单,学习入门易入手[呵呵,都这么说, ...

  3. Ubuntu12.04 安装nginx和mongo过程

    1.安装php和php-cgi apt-get install php5 php5-cgi 2.安装 nginx apt-get install nginx 3.安装 MongoDB apt-get ...

  4. 记一次rsync日志报错directory has vanished

    中午两点的时候邮件告知rsync同部svn源库失败,看rsync日志报错显示如上,当时还在上课,没在公司,怀疑是不是有人动了svn的版本库,后来询问同事并通过vpn登录服务器上查看版本库是正常的,也没 ...

  5. 【BZOJ】1731: [Usaco2005 dec]Layout 排队布局

    [题意]给定按编号顺序站成一排的牛,给定一些约束条件如两牛距离不小于或不大于某个值,求1和n的最大距离.无解输出-1,无穷解输出-2. [算法]差分约束+最短路 [题解]图中有三个约束条件,依次分析: ...

  6. 全面了解Nginx主要应用场景(数漫江湖)

    前言 本文只针对Nginx在不加载第三方模块的情况能处理哪些事情,由于第三方模块太多所以也介绍不完,当然本文本身也可能介绍的不完整,毕竟只是我个人使用过和了解到过得.所以还请见谅,同时欢迎留言交流 N ...

  7. SVG(可缩放矢量图形)

        SVG可缩放矢量图形(Scalable Vector Graphics)是基于可扩展标记语言(XML),用于描述二维矢量图形的一种图形格式.SVG是W3C("World Wide W ...

  8. linux下守护进程的创建

    最近在学习linux c编程 看到了守护进程的创建,感觉很好玩, 测试环境ubuntu 15.04 下面贴出测试代码 #include <stdio.h> #include <std ...

  9. Java基础 变量和数据类型及相关操作

    Java基本语法: 1):Java语言严格区分大小写,好比main和Main是完全不同的概念. 2):一个Java源文件里可以定义多个Java类,但其中最多只能有一个类被定义成public类.若源文件 ...

  10. Revison