web123456

Dynamically change the properties of the Element tag using Vue (mainly through the entire replacement of v-if and v-else)

  • <template>
  • <div>
  • ===============================33, dynamically change the properties of the Element tag using Vue (mainly through the entire replacement of v-if and v-else)===============================
  • <div>
  • <button @click="disableSelect">Disabled</button>
  • <button @click="undisableSelect">Normal use</button>
  • <div v-if="show">
  • <el-select v-model="" placeholder="Please select" size="mini">
  • <el-option
  • v-for="value in "
  • :key=""
  • :label=""
  • :value=""
  • >
  • </el-option>
  • </el-select>
  • </div>
  • <!--
  • disabled Disable properties
  • -->
  • <div v-else>
  • <el-select v-model="" placeholder="Please select" size="mini" disabled>
  • <el-option
  • v-for="value in "
  • :key=""
  • :label=""
  • :value=""
  • >
  • </el-option>
  • </el-select>
  • </div>
  • </div>
  • </div>
  • </template>
  • <script>
  • export default {
  • name: "DynamicallyChangingLabelProperties_33",
  • data() {
  • return {
  • show: true,
  • data: {
  • value: [{
  • value: '1',
  • label: ' '
  • }, {
  • value: '2',
  • label: 'General'
  • },
  • {
  • value: '3',
  • label: 'CSV'
  • },
  • {
  • value: '4',
  • label: 'TSV'
  • },
  • {
  • value: '5',
  • label: 'JSON'
  • },
  • {
  • value: '6',
  • label: 'Directory'
  • }],
  • selectValue: '',
  • isValueDisabled: true,
  • },
  • }
  • },
  • methods:{
  • disableSelect(){
  • = false;
  • },
  • undisableSelect(){
  • = true;
  • }
  • }
  • }
  • </script>
  • <style scoped>
  • </style>