无论如何，是否能够使用切换密码按钮并使q-input同时为只读？

Question

我正在尝试在我的应用程序中显示多个用户的密码。有什么办法可以让我将q型输入的password类型的密码设置为只读，并同时启用切换密码按钮吗？我现在设置的方式是，有切换密码按钮，但是每当我将其设置为只读时，它都没有任何功能。

<q-card color="secondary" dark class="q-ma-sm" v-for="user in users" :key="user.UserID" >
            <q-card-title>
              <div class="row">
                <div class="row">
                  <div id="leftrow">
                    <p class="margintop"><b>First Name:</b></p>
                    <p class="margintop"><b>Last Name:</b> </p>
                    <p class="margintop"><b>Phone Number:</b> </p>
                    <p class="margintop"><b>Address:</b> </p>
                    <p class="margintop"><b>Username:</b> </p>
                    <p class="margintop marginbottom"> <b>Password:</b> </p>
                  </div>
                  <div id="rightrow">
                    <p class="margintop">{{ user.FirstName }}</p>
                    <p class="margintop">{{ user.LastName }}</p>
                    <p class="margintop">{{ user.PhoneNumber }}</p>
                    <p class="margintop">{{ user.Address }}</p>
                    <p class="margintop">{{ user.Username }}</p>
                    <p class="margintop marginbottom">
                      <q-input type="password" :value="user.Password" class="margintop passcode" color="secondary" readonly inverted :style="{'min-width': width}"/>
                    </p>
                  </div>
                </div>
                <div class="column" slot="right">
                  <div>
                    <q-icon name="person" size="50px"/>
                  </div>
                </div>
              </div>
            </q-card-title>

            <q-card-separator />
            <q-card-actions>
              <q-btn icon="edit" @click="edituser(user)" class="inputspace">
                <q-tooltip anchor="bottom middle" self="top middle" :offset="[10, 10]" color="secondary" @click="showing = false">
                  Edit
                </q-tooltip>
              </q-btn>
              <q-btn icon="delete" color="secondary" @click="deactivate(user)" class="inputspace">
                <q-tooltip anchor="bottom middle" self="top middle" :offset="[10, 10]" color="secondary" @click="showing = false">
                  Deactivate
                </q-tooltip>
              </q-btn>
            </q-card-actions>
          </q-card>