vue react angular开发的页面 如何在控制台修改受控表单域的值

一般情况下，我们通过input.value='xxx'可以修改一个输入框的值。
但是对于vue/react/angular这类双向绑定类型的框架开发的受控表单域，想修改他的值，没那么容易。

首先贴出实现源码：

function inputValue(el, value) {
    const prop = HTMLInputElement.prototype;
    const setValue = Object.getOwnPropertyDescriptor(prop, 'value').set;
    setValue.call(el, value);
    const event = new Event('input', { bubbles: true });
    el.dispatchEvent(event);
}

关于getOwnPropertyDescriptor，参考：
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptor

关于getOwnPropertyDescriptor实现深拷贝的方案：
http://www.360doc.com/content/20/0402/22/69356412_903490748.shtml

Object.defineProperties({},Object.getOwnPropertyDescriptors(obj))

不仅可以拷贝数据，对象和函数，还能拷贝getter/setter，真正的一比一拷贝