Javascript 已安装的上的Vue复选框未在边缘中工作_Javascript_Vue.js_Microsoft Edge

Javascript 已安装的上的Vue复选框未在边缘中工作

javascript vue.js

Javascript 已安装的上的Vue复选框未在边缘中工作,javascript,vue.js,microsoft-edge,Javascript,Vue.js,Microsoft Edge,我正在处理一个Vue页面，该页面上有一个复选框，在装入该复选框后，我需要从cookie中读取一个值，如果需要，请选中该复选框。我注意到，在边缘浏览器中，它不能正确设置，即使Mounted被明确地调用我把这个问题归结为以下最小的例子。如果您在Edge中打开它并点击refresh，您应该会看到它有时未被选中。在Chrome/IE11中始终如此关于是什么导致了这一问题以及如何解决这一问题，有什么建议吗 <!DOCTYPE html> <html> <head>

我正在处理一个Vue页面，该页面上有一个复选框，在装入该复选框后，我需要从cookie中读取一个值，如果需要，请选中该复选框。我注意到，在边缘浏览器中，它不能正确设置，即使Mounted被明确地调用

我把这个问题归结为以下最小的例子。如果您在Edge中打开它并点击refresh，您应该会看到它有时未被选中。在Chrome/IE11中始终如此

关于是什么导致了这一问题以及如何解决这一问题，有什么建议吗

<!DOCTYPE html>
<html>
<head>
  <title>Vue / Edge Checkbox Issues</title>
  <script src="https://unpkg.com/vue"></script>
</head>
<body>
  <div id="app">
    <p>This checkbox should become checked on mounted. Hit refresh and see what happens in MS Edge.</p>
    <label>
        <input type="checkbox" name="remember" v-model="remember">
      <span>Remember Me</span>
    </label>
  </div>
  <script>
    var app = new Vue({
      el: '#app',
      data: {
        remember: false
      },
      methods : {
        check () {
          this.remember = true
        }
      },
      // Hooks
      mounted () {
        this.check()
      }
    })
  </script>
</body>
</html>

我现在猜一点

v-model是输入事件的简短符号。但单击本机复选框时会发出更改事件

如果我的观点是正确的，那么以下几点应该有效：

<input type="checkbox" name="remember" :checked="remember ? 'checked': '' @change=remember = !remember">

否则，它可能会与该组件的其他实例发生冲突。

您能试试这段代码吗（我没有边缘测试）

刚在edge上测试过，效果很好。我复制了你的代码，甚至是创建方法的代码。有趣的是，你能告诉我你的edge版本是什么吗？Microsoft edge 44.17763.1.0和Microsoft EdgeHTML 18.17763Thx。。我正在运行Microsoft Edge 41.16299.726.0和Microsoft EdgeHTML 16.16299。。。。我将在虚拟机中使用新的边缘进行测试，看看是否仍然存在问题。不，我确实尝试过，作为回调和承诺。嗯，danke很好地抓住了可能这就是问题，我们实际上从v-bind开始：checked=“…”但chrome总是报告相反的值（如果未选中启动并单击复选框，则onchange会报告false而不是true，反之亦然）。v-model似乎已修复此问题，但在Edge中没有。我将切换回它，并查看Edge是否与v-bind一起工作。RE:update…在实际项目中，它是data（）{return{…我只是想找到最小的符号来解释这个问题。不过谢谢你提供的信息。对我来说，使用v-bind没有什么不同…不起作用，不幸的是，同样的结果我认为IE11不支持我上面写的函数符号。但是在我们的实际项目中，巴贝尔编译JS，使它在IE1中工作1.我提供的片段实际上只是为了隔离我在Edge中看到的问题。

<input type="checkbox" name="remember" :checked="remember ? 'checked': '' @change=remember = !remember">

data () {
  return {
    remember: false
  }
}

  var app = new Vue({
      el: '#app',
      data: {
        remember: false
      },
      methods: {
        check: function () {
          this.remember = true
        }
      },
      // Hooks
      mounted: function () {
        this.check()
      }
    })