Bootstrap Vue - make Dropdown List readonly

In my "Bootstrap Vue" project I have a list that changes input fields to readonly state if the user clicks on the "confirm" button. I am doing this with a boolean variable that every list element has. (true --> readonly, false --> write) .

:readonly="project_element.read_only" this works for all the normal inputs, but not for the dropdown menu.

Is there a way to make a dropdown menu also readonly?

This is my dropdown menu:

<td v-show="statusc">
  <b-form-group id="input-group-4" label-for="input-3">
    <b-form-select
      id="input-4"
      v-model="project_element.project_state"
      :options="project_status"
      required
      :readonly="project_element.read_only"
    ></b-form-select>
  </b-form-group>
</td>

In the picture you can see, that the dropdown menu is the only thing that is not affected. [1]: https://i.sstatic.net/81ISF.png

Solution

Make it disabled instead:

<b-form-select
  :disabled="project_element.read_only"
></b-form-select>