vue标签内循环数据逗号分隔
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>vue标签内循环数据逗号分隔</title>
<script src="http://unpkg.com/vue/dist/vue.js"></script>
</head> <body>
<div id="app">
<template>
<span v-for="(item,index) in nameData">
{{ index == nameData.length-1 && item.name || (item.name + ',') }}
</span>
</template>
</div> <script>
var Main = {
data() {
return {
nameData: [
{
name: '张三'
},
{
name: '李四'
},
{
name: '王五'
},
{
name: '赵六'
}
]
};
}
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')
</script>
</body> </html>
vue标签内循环数据逗号分隔的更多相关文章
- 23-python用BeautifulSoup用抓取a标签内所有数据
1.获取子标签: thr_msgs = soup.find_all('div',class_=re.compile('msg')) for i in thr_msgs: print(i) ...
- python3用BeautifulSoup用字典的方法抓取a标签内的数据
# -*- coding:utf-8 -*- #python 2.7 #XiaoDeng #http://tieba.baidu.com/p/2460150866 #标签操作 from bs4 imp ...
- Vue 目录结构 绑定数据 绑定属性 循环渲染数据
一.目录结构分析 node_modules 项目所需要的各种依赖 src 开发用的资源 assets 静态资源文件 App.vue 根组件 main.js 配置路由时会用 .babelrc 配置文件 ...
- *.vue文件的template标签内使用form标签
由于form表单有重复提交的问题,所以在vue文件内直接使用form标签时需要注意这个问题,否则会导致页面重复刷新跳转不成功的问题 解决方案: <form @submit.prevent> ...
- 在Vue中由后台数据循环生成多选框CheckBox时的注意事项
多选框是一种非常常见的功能,有时候我们会根据后台返回的数据进行多选框渲染,之前做项目时遇到循环生成多选框时,v-model绑定的值会随着选中与取消改变,但页面却不会变化 的情况,后来测试了一下,发现多 ...
- vue中如何实现数据的双向绑定
vue中如何实现数据的双向绑定 实现视图变化数据跟着变:分两步,上面get中的为第二步(即再次读取的时候会调用get方法得到之前设置的值,以此来实现动态改变) 由于直接写obj.name = this ...
- Vue.js学习 Item4 -- 数据双向绑定
Vue.js 的模板是基于 DOM 实现的.这意味着所有的 Vue.js 模板都是可解析的有效的 HTML,且通过一些特殊的特性做了增强.Vue 模板因而从根本上不同于基于字符串的模板,请记住这点. ...
- Vue(四) 内置指令
现在介绍 Vue.js 中 更多的内置指令 基本指令 v-cloak v-cloak 不需要表达式,它会在 Vue 实例结束编译时从绑定的 HTML 元素上移除,经常和 CSS 的 display: ...
- Vue 父组件循环使用refs调用子组件方法出现undefined的问题
Vue 父组件循环使用refs调用子组件方法出现undefined的问题 1. 背景 最近前端项目遇到一个问题,我在父组件中使用了两个相同的子组件child,分别设置ref为add和update.其中 ...
随机推荐
- Net core学习系列（一）——Net Core介绍
一.什么是Net Core .NET Core是适用于 windows.linux 和 macos 操作系统的免费.开源托管的计算机软件框架,是微软开发的第一个官方版本,具有跨平台 (Windows. ...
- Shell流程控制语句if
(1).if语句 语法格式: if 判断条件 ; then 命令 fi 或 if 判断条件 then 命令 fi if语句流程图: 实例:判断命令是否执行成功,成功则输出语句This is ok. [ ...
- Linux中添加新硬盘后对硬盘的分区以及挂载
转自:https://www.linuxidc.com/Linux/2018-06/152958.htm 我将使用VM来进行模拟 先使用df看下我的电脑硬盘信息: df -h 可以看到只有一个sda1 ...
- exports module.exports export export default之间的关系
exports 和module.exports是CommonJS模块规范 export export default是ES6模块的规范,两者完全是不同的概念. node应用由模块组成,采用的是Comm ...
- [LeetCode] 403. Frog Jump 青蛙跳
A frog is crossing a river. The river is divided into x units and at each unit there may or may not ...
- IEDA中使用阿里插件Alibaba Cloud Toolkit和Arthas(阿尔萨斯)
在 IntelliJ IDEA 中安装和配置 Cloud Toolkit 在 IntelliJ IDEA 中安装和配置 Cloud Toolkit 后,您可以将本地应用快速部署到阿里云 ECS.EDA ...
- LumiSoft 邮件操作删除(无法删除解决方法)
最近在用 LumiSoft 进行邮件读取,然后操作相关附件邮件使用的是qq邮箱,读取后进行移除,但是怎么都移除不了 后来咨询了官方客服,原来是设置不对 需要 取消掉 X禁止收信软件删信 (仅对 PO ...
- 下一代无服务器的发展形态： Serverless2.0
6 月 25 日,在上海召开的 KubeCon 2019 大会上,腾讯云重磅发布了下一代无服务器的发展形态:Serverless2.0.本文将以 Serverless 的概念.发展.形态.应用以及技术 ...
- 【转帖】微软全新Windows 10X细节一览
微软全新Windows 10X细节一览 https://www.cnbeta.com/articles/tech/906241.htm windows NT之后 又一大改进 今年的Surface发布会 ...
- web渗透思维导图
更新中!!