【问题标题】:"Failed to generate render function" when i use tree component of ElementUI当我使用 ElementUI 的树组件时“无法生成渲染功能”
【发布时间】:2018-07-23 08:47:12
【问题描述】:

我想在 IE 11 中使用 Element UI,当我使用树组件时,它会产生错误。 它会产生错误

Failed to generate render function:
SyntaxError 'missing  in'

我想在文本前显示一个图标。但在 IE 11 中,Chrome 正常时会出错。

任何人都可以告诉我问题..thx

整个演示是

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>MLLRSJ</title>

<link rel="stylesheet" href="./Scripts/assets/Element/index.css">
<script src="./Scripts/assets/vue/vue.js"></script>
<script src="./Scripts/assets/Element/index.js"></script>
</head>
<body>
<div id='Element'>
<el-tree :data="tree" :props="treeProps">
        <span slot-scope='{node,data}'>
            <i class='el-icon-check'></i>
            <span style="display:inline" v-html='node.label'></span>
        </span>
</el-tree>
</div>

</body>
<script>
var vm = new Vue({
    el:'#Element',
    data:{
        tree:[{
                label:'1',
                children:[{
                        label:'1-1'
                }],
            },
            {
                label:'2',
                children:[
                    {
                        label:'2-1'
                    }
                ]
            }
        ],
        treeProps:{
            label:'label',
            children:'children'
        }
    }
})
</script>
</html>

【问题讨论】:

  • 也许你可以创建一个有问题的演示?
  • 如何为组件声明模板?是否使用script 标签放置到主页?

标签: vue.js render element-ui


【解决方案1】:

如果您使用 IE11,请尽量避免使用大括号(在您的示例中为 slot-scope)和 内联模板 中的箭头函数(我的一个项目中遇到了同样的问题):

<el-tree :data="tree" :props="treeProps">
    <span slot-scope='someObject'>
        <i class='el-icon-check'></i>
        <span style="display:inline" v-html='someObject.node.label'></span>
    </span>
</el-tree>

【讨论】:

  • @SolBadguy 如果解决了您的问题,请将其标记为正确答案:)
猜你喜欢
  • 1970-01-01
  • 2021-06-01
  • 2020-01-28
  • 2021-04-21
  • 1970-01-01
  • 2020-03-26
  • 2020-05-13
  • 2021-06-12
  • 1970-01-01
相关资源
最近更新 更多