在 uni-app 中使用 v-for 和 v-if 进行列表渲染和条件判断时，如果遇到符号未渲染的问题，通常是因为 v-if 和 v-for 的使用顺序或者作用域问题。在 Vue.js（包括 uni-app）中，推荐将 v-if 放置在 v-for 外部，或者通过计算属性先对数据进行处理，以避免性能问题和作用域混淆。

以下是一个示例，展示了如何在 uni-app 中正确使用 v-for 和 v-if，并确保符号正确渲染：

示例场景

假设我们有一个列表数据，每个项都有一个 status 属性，我们只想渲染 status 为 active 的项，并且每个项中包含一个符号（如勾号表示激活状态）。

数据结构

data() {
    return {
        items: [
            { id: 1, name: 'Item 1', status: 'active' },
            { id: 2, name: 'Item 2', status: 'inactive' },
            { id: 3, name: 'Item 3', status: 'active' }
        ]
    };
}

模板代码

方法一：在 v-for 外部使用 v-if（不推荐，但可用于简单场景）

<view>
    <view v-for="item in items" :key="item.id">
        <view v-if="item.status === 'active'">
            {{ item.name }} - ✔
        </view>
    </view>
</view>

这种方法在列表项较少时可行，但性能不佳，因为 v-for 会先渲染所有项，然后 v-if 再进行过滤。

方法二：使用计算属性预处理数据

computed: {
    activeItems() {
        return this.items.filter(item => item.status === 'active');
    }
}

<view>
    <view v-for="item in activeItems" :key="item.id">
        {{ item.name }} - ✔
    </view>
</view>

这种方法更推荐，因为它先通过计算属性过滤数据，然后再进行渲染，提高了性能和代码的可读性。

结论

确保符号正确渲染的关键在于正确地使用 v-for 和 v-if，以及合理地处理数据。通过计算属性预处理数据是一种高效且清晰的方式，可以避免直接在模板中混用 v-for 和 v-if 带来的性能问题和作用域混淆。上述代码示例展示了如何在 uni-app 中实现这一点。