将 IFrame SRC 绑定到 VueJS 数据

Question

我可以更改iframe src的输入值吗？我正在想象的 VueJS 是否可能实现这一点：

<input id="input"/>
<iframe src="welcome.html"></iframe>

let vm = new Vue ({
  data: {
    src: "welcome.html",
  }, 
});
document.getElementById("input").value = /* src from vm.data? */

Answer 1

您应该能够执行以下操作：

<input id="input"/>
<iframe :src="iframeSrc"></iframe>

let vm = new Vue ({
  data: {
    iframeSrc: "welcome.html",
  }, 
});

但是你需要将 Vue 绑定到某个父元素，例如<div id="app"></div>

new Vue({
    el: "#app",
    ...
}