Javascript Vue未检测到使用JQuery或JS所做的更改

我做了一支笔，这样你就能明白我在说什么：

输入和段落都绑定到Vue（anioPicker）的值，但1秒后我用jquery更改了值，但Vue没有检测到更改，或者我没有正确注册事件。段落仍然显示2020，即使我已经更改了它，但在vue实例中仍然是2020。Vue仅在我键入或删除某些内容时反映更改。你能告诉我我做错了什么吗

谢谢你的帮助

var vm=new Vue({
el:“#通知栏”，
数据：{
阿尼奥皮克：2020年，
},
方法：{
},
观察：{
anioPicker:函数（值）{
日志（“监视的属性”，值）；
}
}
});
$（窗口）。打开（“加载”，函数（e）{
setTimeout（函数（）{
$（“#anioDate”）.val（2012年）；
console.log（document.querySelector（'.yearpicker'）.value）
}, 1000);
});
.datePick{
显示：内联块；
背景:"828282 ;；
变换：倾斜（-10度）；
左侧填充：10px；
字号：500；
垫面：0.5雷姆；
垫底：0.5雷姆；
右边填充：10px；
边缘顶部：0.5雷姆；
文本对齐：居中；
边缘底部：0.5雷姆；
颜色：#ffffff；
}
.选定日期{
背景色：#224abed6；
}
.styleInput{
边际：0px；
宽度：38px；
颜色：白色；
背景#4466c8；
边界：无；
填充：0；
大纲：无；
边界半径：0；
}

粪便：{{anioPicker}}

Vue使用自己的VDom（虚拟DOM）来管理数据和组件。您正在修改基础DOM实例，它不会将这些更改向上传播到VDom

您必须修改
vue
实例中的值

在您的情况下，可以通过直接改变root
vm
实例的值来实现这一点：

vm.anioPicker=2012