vue table v-for v-for其他用法

不念不忘少年蓝@ 2022-06-02 09:47 200阅读 0赞

<!DOCTYPE html>
    <html>
    <head>
    	<title></title>
    	<script type="text/javascript" src="js/vue.js"></script>
    </head>
    <body>
    	<table>
    		<thead>
    			<tr>
    				<td>性别</td>
    				<td>年龄</td>
    				<td>分数</td>
    			</tr>
    		</thead>
    		<tbody id="tby">
    			<tr v-for="(item,index) in stu">
    				<td>{
       {item.sex}}</td>
    				<td>{
       {item.age}}</td>
    				<td>{
       {item.score}}</td>
    			</tr>
    			
    		</tbody>
    	</table>
    
    	<script type="text/javascript">
    		new Vue({
    			el:'#tby',
    			data:{
    				stu:[
    						{sex:'男',age:20,score:88},
    						{sex:'女',age:45,score:98},
    						{sex:'男',age:20,score:66}
    					]
    			}
    		});
    	</script>
    </body>
    </html>

<!DOCTYPE html>
    <html>
    <head>
    	<title></title>
    	<script type="text/javascript" src="js/vue.js"></script>
    </head>
    <body>
    	<div id="example">
    		<ul v-for="tmp in list">
    			<li>{
       {tmp}}</li>
    		</ul>
    		
    	</div>
    
    	<script type="text/javascript">
    		new Vue({
    			el:'#example',
    			data:{
    				list:[100,200,300]
    			}
    		})
    	</script>
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，200人围观）

还没有评论，来说两句吧...

相关阅读

相关 el-table的那些特殊用法

聊目前比较流行的Vue前端的架构。目前因为Vue良好编码规范，学习上手周期短等优势。被我们很多大前端组所追捧，其中有的项目采用Element组件库占比达90%。主要用到e...

谁借莪１个温暖的怀抱￠/ 2024年04月17日 05:38/ 0 赞/ 56 阅读

相关 Vue slot 用法

Vue 实现了一套内容分发的 API，将 `<slot>` 元素作为承载分发内容的出口。可以理解为模板中的占位符, 在实例化时用自定义标签元素替代. 本文基于Vue 2.0

约定不等于承诺〃/ 2022年10月01日 07:56/ 0 赞/ 113 阅读

相关 for 循环的一些其他写法、用法

文章目录 for 循环的一些其他写法、用法 for 循环的一些其他写法、用法 -------------------- public static

刺骨的言语ヽ痛彻心扉/ 2022年09月04日 11:45/ 0 赞/ 183 阅读

相关 Github使用（3）-Git的其他用法

目录： [减少【.git】文件夹的大小和文件数][.git] [更换git for windows的文本编辑器][git for windows]

灰太狼/ 2022年06月14日 22:16/ 0 赞/ 240 阅读

相关 vue table v-for v-for其他用法

<!DOCTYPE html> <html> <head> <title></title> <script type="text/j

不念不忘少年蓝@/ 2022年06月02日 09:47/ 0 赞/ 201 阅读

相关 vue基本用法

一、v-text与v-html.html v-html 可以解析标签，解析样式,v-text不能解析，只能原样输出 ![在这里插入图片描述][watermark_t

骑猪看日落/ 2022年01月22日 02:27/ 0 赞/ 241 阅读

相关 Vue 一些用法

v-model : 数据绑定（多数用于表单元素） ps:同时v-model支持双向数据绑定 v-for : 用于元素遍历 v-on:事件名称=“方法名” （事件绑定）

怼烎@/ 2021年12月22日 19:45/ 0 赞/ 301 阅读

相关 vue 中用法

1.v-for和data属性 <li v-for="(item, index) in message" v-on:click="addClassFun(inde

我不是女神ヾ/ 2021年12月03日 15:07/ 0 赞/ 407 阅读

相关 vue-ref-$refs用法

[vue $refs的基本用法][vue _refs] <div id="app"> <input type="text" ref="input1

梦里梦外;/ 2021年10月09日 03:36/ 0 赞/ 383 阅读

相关 vue指令用法

vue指令指令式带有 `v-` 前缀的特殊特性`v-text`和`v-html`都属于指令将数据和dom做关联，当表达式的值改变时，响应式地作用在视图解决大胡子语法闪烁

桃扇骨/ 2021年07月25日 02:03/ 0 赞/ 479 阅读