vue--循环列表
<template>
<div id="app">
<p v-for="x in list">{{x}}</p> //绑定列表
<p v-for="x in list1">{{x.name}}</p> //绑定列表
// 让第一个高亮显示
<p v-for="(x,k) in list" :class="{'red':k==0}">{{k}}--{{x}}</p>
// 让第二个变成蓝色
<p v-for="(x,k) in list" :class="{'red':k==0,'blue':k==1}">{{k}}--{{x}}</p>
</div>
</template>
<script>
export default {
name: 'App',
data (){
return {
msg:"你好!",
list:['a','b','c','d'],
}
}
}
</script>
vue--循环列表的更多相关文章
- Vue 循环为选中的li列表添加效果
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>Vu ...
- 循环列表的Java实现,解决约瑟夫环问题
import java.util.Scanner; /** * 循环列表的Java实现,解决约瑟夫环问题 * * @author LIU * */ public class LinkedList { ...
- 微信小程序实现给循环列表点击添加类(单项和多项)
在微信小程序里面没有DOM对象, 不能操作DOM. 所有的操作通过数据来实现,下面主要实现了给循环列表点击添加类的操作 一.单项 目标需求:实现下图,给点击的view增加类,每次只能选择一个. 主要思 ...
- 页面中php传值后循环列表js获取点击的id
页面中php传值后循环列表js获取点击的id值进行js操作 <script type="text/javascript" src="__PUBLIC__/js/jq ...
- Cocos2d-x3.0下实现循环列表
本文的实现是參照我之前在做iOS时实现的一个能够循环的列表这里用C++重写一遍. 效果: 原文地址:http://blog.csdn.net/qqmcy/article/details/2739301 ...
- python 单向循环列表
# -*- coding: utf-8 -*- # @author: Tele # @Time : 2019/04/23 下午 6:54 # 单向循环列表 # 单向循环列表与单向列表的不同之处在于最后 ...
- Python循环列表的方法
python循环列表的几种方法: 第一,依次打印列表中的各项值. 1 #!usr/bin/env python3 2 #!-*- Coding:utf-8 -*- 3 4 ''' 5 多种循环列表的方 ...
- 微信小程序循环列表点击每一个单独添加动画
首先,咱们看一下微信小程序动画怎么实现,我首先想到的是anime.js,但是引入之后用不了,微信小程序内的css也无法做到循环的动态,我就去找官方文档看看有没有相应的方法,哎,还真有 点击这里查看 微 ...
- Unity-UGUI-无限循环列表
前言:项目准备新增一个竞技场排行榜,策划规定只显示0-400名的玩家.我一想,生成四百个游戏物体,怕不是得把手机给卡死?回想原来在GitHub上看到过一个实现思路就是无限循环列表,所以就想自己试试.公 ...
- Vue 基本列表 && 数据过滤与排序
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8" /> 5 & ...
随机推荐
- Unity接第三方SDK时遇到的坑
1.大部分SDK的方法需要在线程中执行,一般会放在主线程里执行,安卓中主线程一般用于UI渲染. this.runOnUiThread(new Runnable() { @Override public ...
- mysql中已经存在某个库中有大小写的表,将lower_case_table_names由0改为1对已经存在的表是否有影响?
需求描述: 今天遇到了修改lower_case_table_names参数的问题,想了下,如果原来里面有表,表名有大小写的, 如果将lower_case_table_names从默认的0改为1之后,那 ...
- html 内联函数宽度设置
width and/or height in tables are not standard anymore; as Ianzz says, they are depreciated. Instead ...
- 怎样把网站升级到http/2
https://juejin.im/post/59c63adf6fb9a00a4c271484
- Spring父容器与子容器
在使用spring+springMVC的web工程中,我们一般会在web.xml中做如下配置: <context-param> <param-name>contextConfi ...
- SpringMVC由浅入深day02_10拦截器
10 拦截器 Spring Web MVC 的处理器拦截器类似于Servlet 开发中的过滤器Filter,用于对处理器进行预处理和后处理. 10.1 拦截定义 定义拦截器,实现HandlerInte ...
- mongodb 初学 目录
mongodb 初学 索引 啦啦啦 MongoDB 教程 NoSQL 简介 MongoDB 简介 Windows 平台安装 MongoDB Linux平台安装MongoDB mongodb 在 Ubu ...
- 8 -- 深入使用Spring -- 3...1 Resource实现类FileSystemResource
8.3.1 Resource实现类------FileSystemResource:访问文件系统的资源的实现类 3.访问文件系统资源 Spring提供的FileSystemResource类用于访问文 ...
- Splash runjs() 方法
runjs() 方法可以执行 JavaScript 代码,它与 evaljs() 功能类似,但是更偏向于执行某些动作或声明某些方法 function main(splash, args) splash ...
- [Python] NotImplemented 和 NotImplementedError 区别
NotImplemented 是一个非异常对象,NotImplementedError 是一个异常对象. >>> NotImplemented NotImplemented > ...