vuejs datepicker 重新排列我的模板设置

Posted 2023-02-23

【中文标题】vuejs datepicker 重新排列我的模板设置

【英文标题】：vuejs datepicker rearrange my template setup

【发布时间】：2020-05-20 00:34:41

【问题描述】：

我尝试将 vuejs datepicker 插入到我的 vue 模板中，但是当我添加组件时，它会通过从右向左移动来重新排列我的模板。影响其他html元素

这是我添加模板之前的图片

这是我在添加日期选择器之前的模板

这是我添加 vuejs-datepicker 后的模板

每个标签都有从右到左的顺序，包括我的链接及其图标交换

下面是我的代码

 <div class="row pb-3 pt-5 bg-light">
      <div class="col-md-8">
            <div class="form-group">
                <label for="distributor">Select Distributor</label>
                   <select class="form-control" id="distributor">
                      <option>M OSEI AKOTO ENT(NESTLE)</option>
                   </select>
            </div>

      </div>
      <div class="col-md-4">
          <div class="form-group">
             <label for="stock_date">Date</label>
                 **<datepicker></datepicker>**

          </div>
          <div class="form-group">
               <label for="stock_invoice">Stock Number</label>
               <input type="text" class="form-control" name="stock_invoice_number" placeholder="stock invoice number">
          </div>
     </div>
 </div>


  <script>

    import moment from 'moment';
    import Datepicker from 'vuejs-datepicker';

    export default 
      name:'AddStocks',
      components: 
          Datepicker
      
  </script>

当我删除 Datepicker 组件时，一切都会恢复正常。

风格图片

检查完样式后，我意识到 datepicker 组件已从我的根 tile div 附加到 i 下的每个标签t

【问题讨论】：

datepicker是第三方组件吗？你检查了它的 CSS 样式吗？

【参考方案1】：

通过检查检查你的风格，所以你会弄错，我需要检查的图像，所以我可以帮助你

【讨论】：

嗨@madi.wd 我已经发布了检查中的风格图片