vue.js - 表格列中的居中复选框
问题描述
我试图在表格列中居中复选框但没有成功。无论我使用什么对齐方式,复选框总是左对齐。奇怪的是,如果我将 v-checkbox 更改为 v-btn,相同的代码也会起作用。这个问题有什么解决办法吗?
https://codepen.io/anon/pen/QVqqVP
这里是简单的视图代码:
<div id="app">
<v-app>
<v-content>
<v-container>
<v-data-table :items="apps" :headers="headers" hide-actions class="elevation-1">
<template slot="items" slot-scope="props">
<td class="text-xs-left">
<h6 class="mb-0">{{props.item.app_name}}</h6>
</td>
<td class="text-xs-center">
<v-checkbox color="primary"/>
</td>
</template>
</v-data-table>
</v-container>
</v-content>
</v-app>
</div>
这里是 Vue 应用程序:
new Vue({
el: '#app',
data: () => ({
apps: [{'app_name':"row1"}, {'app_name':"row2"}]
})
})
解决方案
我找到了 Vue 2.6.10 的解决方案
<td class="text-xs-center">
<v-checkbox :input-value="props.item.closed" readonly hide-details class="align-center justify-center"></v-checkbox>
</td>
添加
类=“对齐中心对齐中心”
在复选框上做伎俩
推荐阅读
- reactjs - React 服务器端渲染无法导入 jsx 文件
- java - 如何实例化从具有任何类型的 ArrayList 扩展的类?
- git - 你可以为 git 提交启用 2FA 吗?
- angular - 如何使用路由在 Angular 应用程序的组件中导航?
- jenkins - 如何使用代理而不是 Master 从 SCM 获取 Jenkins 管道脚本
- python - 如何在查询 dynamodb 时使用 sys.argv
- javascript - 有没有办法让子页面在 Nuxt 中继承其父级的 index.vue 文件?
- regex - 如何制作正则表达式以匹配模式之间带有随机点的字符串?
- python - Nuxt.js 与 Flask 的连接被拒绝。路由不好?
- django - 将静态资产传递给 Django 模板中的包含