小编Mah*_*far的帖子

反应类方法未定义 no-undef

我是反应的新手。我的应用程序运行正常,但在添加 eslint(airbnb) 后,我的应用程序无法编译。

export default class HelloWorldComponent extends React.Component {
  render() {
    return (
      <div>
        <div>{this.props.message}</div>
        <button onClick={this.props.helloWorldClick}>Hello 
        World</button>
      </div>
    )
  }
  helloWorldClick = () => {
    console.log('here') 
  }
}
Run Code Online (Sandbox Code Playgroud)

在 .eslintrc 文件上添加 { "parser": "babel-eslint" } 之前,它抛出了 eslint 错误

“[eslint] 解析错误:意外的令牌 =”——在 helloWorldClick 箭头函数行上。

添加解析器后,我没有任何 elsint 错误。但是运行该应用程序时出现编译错误。

编译失败 ./src/component/HelloWorldComponent.js Line 18: 'helloWorldClick' is not defined no-undef

请让我知道如何解决此错误。

reactjs eslint react-redux eslint-config-airbnb

5
推荐指数
1
解决办法
9421
查看次数

使用 angular2 和 bootstrap 将数组数据显示为 3 列

在我的 angular2 组件中,我列出了数据,我想使用 booststrap 类(col-md-4)将这些数据显示到 3 列中。

例如,我有如下所示的 json 对象。

{
"menuList":[
    {"id":1,"sn":"nd","name":"Noodles"},
    {"id":2,"sn":"sd","name":"Salad"},
    {"id":3,"sn":"sp","name":"Soup"},
    {"id":4,"sn":"fb","name":"Fresh Bowl"},
    {"id":5,"sn":"sn","name":"Snacks"},
    {"id":6,"sn":"pz","name":"Pizza"},
    {"id":7,"sd":"nd","name":"Sandwich"}
]
Run Code Online (Sandbox Code Playgroud)

}

我想将名称显示为 3 列。

面条 沙拉 汤 新鲜碗 小吃 三明治

这是我尝试过的代码。

<div *ngFor="let menu of menuList; #i=index" *ngIf="i % 3 == 0" class="row">
    <div class="col-md-4">{{menu[$i].name}}</div>
    <div class="col-md-4">{{menu[$i + 1].name}}</div>
    <div class="col-md-4">{{menu[$i + 2].name}}</div>
Run Code Online (Sandbox Code Playgroud)

但它显示错误,因为首先我不能在同一元素中使用 ngFor 和 ngIf 。

请给我一个解决方案。

javascript twitter-bootstrap-3 angular

3
推荐指数
1
解决办法
2610
查看次数

Ajax在bootstrap模式上调用多次onclick事件

通过单击按钮它加载了一个bootstrap模式.在模态上有一个表单和单击保存按钮我试图通过ajax调用提交表单.第一次ajax调用触发一次,但第二次ajax url触发两次.我在firebug控制台部分看到post url被多次调用.

这是我的jquery代码.

 $(".show-modal").click(function() {
                    $('.upload-modal').modal();

                    $(".save-logo").click(function(e) {

                        e.preventDefault();
                        $.ajax({
                              type : "POST",
                              data : data,                        
                              contentType: false,
                              cache : false,
                              processData: false, 
                              url : "../../io/upload/"
                        }).done(function(rawData) {
                            $('.modal-header .close').click();

                         })

                    });
             })
Run Code Online (Sandbox Code Playgroud)

javascript ajax jquery twitter-bootstrap bootstrap-modal

1
推荐指数
1
解决办法
5943
查看次数