vantUI van-cell 多个值拼接写法

最新推荐文章于 2024-10-20 14:17:02 发布

原创最新推荐文章于 2024-10-20 14:17:02 发布 · 1.4k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#vue #js

本文介绍在vantUI框架中如何使用多个值进行拼接显示。通过<template#label>标签嵌套的方式实现<van-cell>组件内的信息展示。具体实现了将表单中的name、position和levelName字段按特定格式拼接。

vantUI van-cell 多个值拼接写法

在下面实例中 <template #label > 标签嵌套。#label 表示的是van-cell的属性。

        <van-cell title="测试用例"  title-class="title-class" label-class="label-class">
          <template #label >
            {{form.name}}{{form.position? ('/' + form.position) : ''}}{{form.levelName? form.levelName : ''}}
          </template>
        </van-cell>