vue 动态加载调查问卷的内容

最新推荐文章于 2024-08-14 13:08:28 发布

laoyaotask

最新推荐文章于 2024-08-14 13:08:28 发布

阅读量1.9k

点赞数

分类专栏： Web前端 Vue 文章标签： vue.js 前端

本文链接：https://blog.csdn.net/laoyaotask/article/details/124367019

版权

本文探讨了如何在前端项目中利用Vue.js和Bootstrap-Vue框架动态加载调查问卷内容，通过js代码实现动态渲染和交互功能。

摘要由CSDN通过智能技术生成

前端用到了bootstrap-vue框架

<template>
    <!-- 提示窗 -->
    <b-alert :show="dismissCountDown" fade :variant="alertType" @dismiss-count-down="countDownChanged"
      style="width: 20rem;height:3.5rem;position: fixed;top:0rem;bottom:0rem;left:0rem;right:0rem;margin: auto; z-index: 10000;">
      {
  {alertMsg}}
    </b-alert>

    <!-- 正文 -->
    <p style="margin: 0.5rem 0.25rem;">
      <b-list-group>
        <b-list-group-item v-for="(item,index) in form.results" :key="index">
          <!-- 显示题目内容。这里的小技巧是根据不同的题目类型给出不同的呈现方式 -->
          <p class="text-dark">{
  {(index+1)+"、"+item.question}}</p>

          <!-- 以下分类型显示答题方式 -->
          <!-- 填空题 -->
          <div v-if="item.qtype=='填空'">
            <b-input v-model=