vxe-grid Changes the color of the table border

The answer is not easy. Please accept it.

To change the border line color of the vxe-grid table, you can use the following method:

In the vxe-grid component, add the border-color style property to change the border line color of the table, for example:

grid :columns="columns" :data="tableData" border-color="#409EFF">grid>

If you need to further customize the table border style, you can do so by overriding the default style in the vxe-grid component. You can create a new style file in your project and then set the new style for the table border in it. For example:

.vxe-table--border {
   border: 1px solid #409EFF;
}

Then import the style file into your Vue component, for example:

<style>
   @import './your-styles.css';
style>

In the above example, we select the div element with the.vxe-table--border class, change its border style to a solid border 1 pixel thick, and set its color to #409EFF.

Hopefully, these methods will help you change the border line color of your vxe-grid table.