JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="//unpkg.com/bootstrap@4.5.3/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="//unpkg.com/bootstrap-vue@2.21.2/dist/bootstrap-vue.css">
<script src="//unpkg.com/babel-polyfill/dist/polyfill.min.js"></script>
<script src="//unpkg.com/vue@2.6.12/dist/vue.min.js"></script>
<script src="//unpkg.com/bootstrap-vue@2.21.2/dist/bootstrap-vue.js"></script>
<script src="//unpkg.com/bootstrap-vue@2.21.2/dist/bootstrap-vue-icons.js"></script>
<div id="app">
<div>
<b-form-datepicker
value='2021-04-25'
>
</b-form-datepicker>
<b-table
:items='items'
>
<template #cell(check)="row">
<b-form-checkbox
checked="true"
>
</b-form-checkbox>
</template>
</b-table>
</div>
</div>
CSS
body { padding: 1rem; }
JavaScript
window.onload = () => {
new Vue({
el: '#app',
data() {
return {
items: [
{id: 1, check: true,},
{id: 2, check: true,},
{id: 3, check: true,},
]
}
},
})
}