Vue.js 如何在日期选择器上禁用标题年份？

演示和完整代码：

如果我使用这个：

.v-date-picker-header__value button {
    pointer-events: none;
}

它起作用了。但它也是一年一个月

我要启用此功能：

并禁用此选项：

---

我该怎么做呢？

是的，使用js只能禁用一年

这里我在挂载的钩子中添加了一段代码，一旦呈现完整的html，就会触发这个钩子

在此处使用代码笔：

新Vue({
el:“#应用程序”，
vuetify:新的vuetify（），
数据（）{
返回{
选择器：新日期（）.toISOString（）.substr（0,10），
}
},
安装的（）{
//选择将观察到突变的节点
var targetNode=document.querySelector（'.v-picker____体'）；
//观察者选项（要观察哪些突变）
var config={attributes:true，childList:true}；
//观察到突变时执行的回调函数
var callback=函数（mutationsList）{
for（突变列表的var突变）{
if（mutation.type=='childList'）{
var headerBtn=document.querySelector（'.accent--text>button'）；
if（headerBtn.innerHTML.length==4）{
headerBtn.disabled=真；
headerBtn.style.cursor='default'；
document.querySelectorAll（'.v-date-picker-header>button'）.forEach（x=>{
x、 禁用=真；
x、 style.cursor='default'；
});
}否则{
document.querySelectorAll（'.v-date-picker-header>button'）.forEach（x=>{
x、 禁用=错误；
x、 style.cursor='pointer'；
});
}
}
else if（mutation.type==“attributes”）{
log（'修改了'+mutation.attributeName+'属性'）；
}
}
};
//创建链接到回调函数的观察者实例
var observer=新的MutationObserver（回调）；
//开始观察目标节点是否存在已配置的突变
observer.observe（targetNode，config）；
}
})

是，使用js仅可禁用年份

这里我在挂载的钩子中添加了一段代码，一旦呈现完整的html，就会触发这个钩子

在此处使用代码笔：

新Vue({
el:“#应用程序”，
vuetify:新的vuetify（），
数据（）{
返回{
选择器：新日期（）.toISOString（）.substr（0,10），
}
},
安装的（）{
//选择将观察到突变的节点
var targetNode=document.querySelector（'.v-picker____体'）；
//观察者选项（要观察哪些突变）
var config={attributes:true，childList:true}；
//观察到突变时执行的回调函数
var callback=函数（mutationsList）{
for（突变列表的var突变）{
if（mutation.type=='childList'）{
var headerBtn=document.querySelector（'.accent--text>button'）；
if（headerBtn.innerHTML.length==4）{
headerBtn.disabled=真；
headerBtn.style.cursor='default'；
document.querySelectorAll（'.v-date-picker-header>button'）.forEach（x=>{
x、 禁用=真；
x、 style.cursor='default'；
});
}否则{
document.querySelectorAll（'.v-date-picker-header>button'）.forEach（x=>{
x、 禁用=错误；
x、 style.cursor='pointer'；
});
}
}
else if（mutation.type==“attributes”）{
log（'修改了'+mutation.attributeName+'属性'）；
}
}
};
//创建链接到回调函数的观察者实例
var observer=新的MutationObserver（回调）；
//开始观察目标节点是否存在已配置的突变
observer.observe（targetNode，config）；
}
})

    <div id="app">
      <v-app id="inspire">
        <v-row justify="center">
          <v-date-picker v-model="picker" no-title></v-date-picker>
        </v-row>
      </v-app>
    </div>

    new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data () {
    return {
      picker: new Date().toISOString().substr(0, 10),
    }
  },
  mounted() {
    // Select the node that will be observed for mutations
    var targetNode = document.querySelector('.v-picker__body');
    // Options for the observer (which mutations to observe)
    var config = { attributes: true, childList: true };

    // Callback function to execute when mutations are observed
    var callback = function(mutationsList) {
        for(var mutation of mutationsList) {
            if (mutation.type == 'childList') {
              var headerBtn = document.querySelector('.accent--text > button');
              if (headerBtn.innerHTML.length == 4) {
                headerBtn.disabled = true;
                headerBtn.style.cursor = 'default';
                document.querySelectorAll('.v-date-picker-header > button').forEach(x => {
                  x.disabled = true;
                  x.style.cursor = 'default';
                });
              } else {
                document.querySelectorAll('.v-date-picker-header > button').forEach(x => {
                  x.disabled = false;
                  x.style.cursor = 'pointer';
                });
              }
            }
            else if (mutation.type == 'attributes') {
                console.log('The ' + mutation.attributeName + ' attribute was modified.');
            }
        }
    };

    // Create an observer instance linked to the callback function
    var observer = new MutationObserver(callback);

    // Start observing the target node for configured mutations
    observer.observe(targetNode, config);
  }
})