This is the 10th day of my participation in the November Gwen Challenge. Check out the event details: The last Gwen Challenge 2021

Vue + Vant component library, vant functions through function calls, functions are preceded by vant.

(e.g. image preview)

vant.ImagePreview(['https://img01.yzcdn.cn/vant/apple-1.jpg']);Copy the code

Vue + Vant component library, mobile page form component shows only one line problem

Form components should be written with double labels, as shown in the example on the official website

<van-field/> <van-form><van-field v-model="form.username" label="To"/></van-form> After modification: <van-field> </van-field><van-field v-model="form.username" label="To"></van-field>
</van-form>

Copy the code

The cascade selector el-Cascader data list content is too high and off screen

Solutions:
Add the following code to the global style

‘/* Fix cascader cascading style sheets off screen */

.el-cascader-panel { height: 210px; }

El-scrollbar horizontal scrollbar style affects aesthetics

Solutions:

Add the following code to the global style

/* Hide the horizontal scroll bar */

.el-scrollbar__wrap{ overflow-x: hidden; }