<template>
<div class="pieAll" >
<template v-for="(item, index) in testData.data">
<!--按钮组-->
<div id="btnBox">
<div>
<ul>
<template v-for="items in item.event">
<li @click='getEventName(items)' :data-id="items.eventName">
<!--<span :class="className"></span>-->
<a href="javascript:;">{{items.className}}</a>
</li>
</template>
</ul>
</div>
<div></div>
<div><input type="text" v-model="search[index]" class="search" placeholder="请输入内容"></div>
</div>
<!--handsontable展示-->
<div :id="item.componentId" v-show='hotSettings'></div>
<!--搜索框--> </template>
<div> </div>
</div>
</template>
data(){
return {
btn:[],
routers: [],
hotSettings: {},
isShowImport: false,
objHot:'',
editData:[],// 修改的位置 testData:'',// 测试数据
isActive:false,// 是否显示搜索框,
search:[]
}
},

在data中定义一个空的数组;

在模板中v-model中,定义好即可;

这只是其中的一种,我觉得还应该有更好的方法,希望大家指出~~

动态绑定v-model的更多相关文章

  1. 什么是V模型?使用SDLC和STLC学习案例研究

    本教程详细介绍了软件/系统开发生命周期(SDLC),如瀑布循环和迭代循环,如RAID和Agile.此外,它继续解释测试的V模型和STLC(软件测试生命周期). 假设为您分配了一项任务,即为客户开发自定 ...

  2. 不可错过的效能利器「GitHub 热点速览 v.22.39」

    如果你是一名前端工程师且维护着多个网站,不妨试试本周榜上有名的 HTML-first 的 Qwik,提升网站访问速度只用一招.除了提升网站加载速度的 Qwik,本周周榜上榜的 Whisper 也是一个 ...

  3. Vue基础知识之常用属性和事件修饰符(二)

    Vue中的常用选项 1.计算属性 computed为可以计算的属性,由get方法和set方法组成,默认调用的是get方法.里面的 计算属性简单来说,就是根据数据推算出来的值,当给这个值赋值时可以影响其 ...

  4. Vue(1)

    一:概述 Vue是一套用于构建用户界面的渐进式JavaScript框架,与其它大型框架不同的是,Vue被设计为可以自底向上逐层应用.Vue的核心库只关心视图层,不仅易于上手,还便于与第三方库或既有项目 ...

  5. Building the Testing Pipeline

    This essay is a part of my knowledge sharing session slides which are shared for development and qua ...

  6. vue.js初级入门之最基础的双向绑定操作

    首先在页面引入vue.js以及其他需要用到的或者可能要用到的插件(这里我多引用了bootstrap和jquery) 引用的时候需要注意文件的路径,准备工作这样基本就完成了,下面正式开始入门. vue. ...

  7. opengles 矩阵计算

    总的变换矩阵: matrix = projection * view * model 模型矩阵: modelMatrix=translateMatrix * scaleMatrix * rotateM ...

  8. 七天学会ASP.NET MVC (五)——Layout页面使用和用户角色管理

    系列文章 七天学会ASP.NET MVC (一)——深入理解ASP.NET MVC 七天学会ASP.NET MVC (二)——ASP.NET MVC 数据传递 七天学会ASP.NET MVC (三)— ...

  9. backbone学习总结(二)

    今天来看下backbone的路由控制的功能.其实个人感觉backbone,模块就那么几个,熟悉它的框架结构,以及组成,就差不多. 废话不多说,我们来看看还剩下的功能. 关于路由和历史管理 通过 Bac ...

  10. yii2框架增删改查案例

    //解除绑定蓝牙 //http://www.520m.com.cn/api/pet/remove-binding?healthy_id=72&pet_id=100477&access- ...

随机推荐

  1. oracle内核参数详解

    一.前言 在生产中,我们安装oracle数据库时,为达到最优我们需要对操作系统的内核参数进行一定的调整.主要从内存.cpu.io以及网络等方面,根据实际情况进行调整.以下参数可供大家参考,如有不当之处 ...

  2. 微信小程序html(wxml)传参

    欢迎加入前端交流群交流知识:749539640 习惯了vue.angular用微信小程序有时候真感觉非人类..需要用data-xxx 先说下我们在vue.angular里事件传参 //html < ...

  3. 循环遍历 文件夹 生成makefile

    在处理 openssl的makefile的source code问题,由于不支持makefile中添加整个文件夹,需要每个 .c 文件都要一个一个添加,所以做一个简单的脚本: #! /bin/bash ...

  4. Socket问题

    http://www.cnblogs.com/mareymarey111/archive/2011/12/08/2280253.html

  5. Maven编译指定(跳过)Module

    今天在项目里新添加了一个Module, 但是在jenkins编译的时候会将这个Module也编译, 问题是这个Module根本不需要编译而且巨慢. 因此我只想编译指定模块 ModuleA以及它依赖的必 ...

  6. 关于WebMvcConfigurationSupport的大坑-静态资源访问不了

    WebMvcConfigurationSupport是spring boot2.0以后用来替代WebMvcConfigurerAdapter,但是如果你直接用WebMvcConfigurationSu ...

  7. Java用递归实现全排列,详细

    package edu.cqu.algorithmTest; import java.util.Scanner; // 全排列,递归实现 public class Main8 { public sta ...

  8. cookie和Session是啥?

    HTTP是无状态(stateless)协议 http协议是无状态协议即不保存状态. 无状态协议的优点: 由于不需要保存记录,所以减少服务器的CPU和内存的资源的消耗.毕竟客户端一多起来保存记录的话对于 ...

  9. 以组件的方式,添加redis_cache

    settings.py中文件内设置如下: CACHES = { 'default':{ 'BACKEND':'django_redis.cache.RedisCache', 'LOCATION':'r ...

  10. 报错Too many connections

    com.mysql.jdbc.exceptions.jdbc4.MySQLNonTransientConnectionException: Data source rejected establish ...