需求:在vue中使用v-for循环出来的元素,设置动态id,之后获取下面的所有textarea标签

template:
<table cellpadding = 2 v-for="(item, index) in arrData" :key="index" cellspacing = 0 :id="'table' + index">
<thead>
<tr>
<th>本周计划</th>
<th>本周实际完成</th>
<th>开累情况</th>
<th>计划完成情况分析</th>
<th>存在的问题</th>
<th>下周计划</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.curweekplan"></textarea>
</td>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.actual_final" ></textarea>
</td>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.condition" ></textarea>
</td>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.analysis" ></textarea>
</td>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.problem" ></textarea>
</td>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.nextplan" ></textarea>
</td>
</tr>
</tbody>
</table>

methods:

// 设置高度
getHeight () {
let arr = this.arrData
for (let i in arr) {
let tableId = 'table' + i
let parent = document.getElementById(tableId) // 获取父元素
let textArea = parent.getElementsByTagName('textarea') // 获取父元素下面的所有textarea元素
// 对子元素的操作
console.log(textArea)
}
},

creat中:

async created () {
await this.getData() // 先获取数据,使用异步机制
this.getHeight() // 获取数据完了生成了节点之后才能获取到元素
},

最新文章

  1. (实例篇)php 使用redis锁限制并发访问类示例
  2. effective OC2.0 52阅读笔记(一 熟悉Objective-C)
  3. Android应用程序窗口(Activity)的窗口对象(Window)的创建过程分析(转)
  4. oracle 时间函数
  5. SE 2014年4月12日
  6. java 爬坑记-@WebServlet异步 不支持@Autowired
  7. poj 2229 Sumsets(记录结果再利用的DP)
  8. [IDE - Eclipse] JSP报错:The superclass “javax.servlet.http.HttpServlet” was not found on the Java Build Path
  9. 快速零配置迁移 API 适配 iOS 对 IPv6 以及 HTTPS 的要求
  10. 【APT】SqlServer游标使用
  11. HTML5 filesystem: 网址
  12. CentOS 6.5安装配置LAMP服务器(Apache+PHP5+MySQL)的方法
  13. LaTeX表格绘制备忘之Go语言中的几个表
  14. 20155239吕宇轩 Linux下IPC机制
  15. Maven根据不同环境打包不同配置文件
  16. KEIL5的安装
  17. Linux touch命令
  18. VSYNC与HSYNC与PCLK与什么有关系
  19. mysql原创博客
  20. NPOI之C#下载Excel

热门文章

  1. Java三行代码搞定MD5加密
  2. 基数排序之多keyword排序运用队列
  3. 利用keepalive和timeout来推断死连接
  4. Java 递归、尾递归、非递归、栈 处理 三角数问题
  5. luogu2341 [HAOI2006]受欢迎的牛
  6. Git 少用 Pull 多用 Fetch 和 Merge 【已翻译100%】【转】
  7. ConcurrentDictionary中的 TryRemove
  8. DMA(direct memory access)直接内存访问
  9. Spark常见编程问题解决办法及优化
  10. 浅谈自学Python之路(购物车程序练习)