小编Tyl*_*ler的帖子

在渲染中反应lambda

编辑:具体来说,下面的AirBnb示例是否有一些细微差别,使其免受Ori Drori评论中的tslint规则/ SO线程的影响?

我正在使用tslint-react并遵循AirBnb的React风格指南

AirBnb的规则"使用箭头函数来关闭局部变量"显示了在纯无状态组件的返回(渲染)中使用的lambda函数.

function ItemList(props) {
  return (
    <ul>
      {props.items.map((item, index) => (
        <Item
          key={item.key}
          onClick={() => doSomethingWith(item.name, index)} // This ok??
        />
      ))}
    </ul>
  );
}
Run Code Online (Sandbox Code Playgroud)

tslint-react的规则"jsx-no-lambda"似乎说这是一件坏事.

jsx-no-lambda:在渲染调用堆栈中创建新的匿名函数(使用函数语法或ES2015箭头语法)可以对付纯组件渲染.在两个lambdas之间进行相等性检查时,React将始终将它们视为不相等的值,并强制组件重新渲染,而不是必要的.

我对这里的最佳做法感到困惑,AirBnb的风格指南是否具有免除关注的细微差别.

干杯!

lambda ecmascript-6 reactjs tslint arrow-functions

5
推荐指数
0
解决办法
1223
查看次数

js 对象中的属性太多

一个 js 对象中可以有多个属性吗?

我想建立一个类似于workaway.info的网站,并且正在考虑如何设计搜索组件。在高级搜索选项下,他们有大约 30 个用于各种类型工作的复选框。每个工作列表中可以包含多种工作类型。

boolean对象中的每个复选框选项都有一个属性,还是array包含boolean所有选项的输入的属性是典型的吗?

有什么理由选择一个?

    ...
//Method 1:
function Job(theCompany, thePosition){
  this.company = theCompany;
  this.position = thePosition;
  this.isMedical = true;
  this.isAdministrative = true;
  this.isLaw = false;
  ...
  }

//Method 2:
function Job(theCompany, thePosition){
  this.company = theCompany;
  this.position = thePosition;
  this.typeOptions = [true, true, false...];
  ...
  }
Run Code Online (Sandbox Code Playgroud)

javascript

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

Express.Static不适用于子目录

Express.static适用于根目录中的任何视图,但是在添加子目录时会中断。

app.use(express.static(path.join(__dirname, 'public')));
Run Code Online (Sandbox Code Playgroud)

作品:

//Homepage
router.get('/', isAuthenticated, function (req, res, next) {
    res.render('index.hbs', {user: req.user, message:req.flash('message')});      //add add'l data {title:'Express', addlData:'SomeData', layout:'layout'}
});
Run Code Online (Sandbox Code Playgroud)

不起作用:

//Organization Profile
router.get('/orgprofile/:username', function(req,res,next){
    User.findOne({username:req.params.username}, function(err,docs){
        res.render('orgprofile.hbs',{orgdetails:docs});
    });
});
Run Code Online (Sandbox Code Playgroud)

我猜__dirname更改为get发出请求的目录,但我只想对所有静态请求使用根(/ public)目录。

javascript node.js express

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

RN:左右对齐一行中的项目

这是sectionList用于连续显示事件名称的RN (0.59) 组件。在renderItem连续呈现3个项目,从前端图像(左图),那么事件名称,与另一头的图像(右图)结束。

render() {
       return (
        <View  style={styles.container}>
          <SectionList
              sections={this.state.activeEvents} 
              renderItem={({item, section}) => {return (
                                                <View style={styles.container}>
                                                  <Image style={styles.image} source={{uri: item.image}}/>
                                                  <TouchableOpacity onPress={() => {this._onPress(item.id)}} >
                                                    <Text style={styles.item} key={item.id}>{item.name}</Text>
                                                  </TouchableOpacity>
                                                  <View style={styles.containerRight}>
                                                    <Image style={styles.image} source={{uri: "https://bootdey.com/img/Content/avatar/avatar1.png"}}/>
                                                  </View>
                                                </View>)}}

              renderSectionHeader={({section}) => <Text style={styles.sectionHeader}>{section.title}</Text>}
              keyExtractor={(item, index) => item + index}
            />
        </View>
      ); 

      }

}

const styles = StyleSheet.create({
    container: {
      flex: 1,
      paddingTop: 22,
      paddingVertical: 12,
      flexDirection: 'row',
      alignItems: 'flex-start',
      flexDirection: 'row',
      alignItems: 'flex-start'
    },
    containerRight: …
Run Code Online (Sandbox Code Playgroud)

react-native react-native-stylesheet

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

在数组数组的map()中使用reduce()

我正在进行freecodecamp挑战,我想知道为什么我的代码不起作用以及如何纠正它.

目标是"返回由每个提供的子阵列中最大数字组成的数组".

我的尝试是使用reduce作为map函数映射输入数组:

function largestOfFour(arr) {
    arr = arr.map(function(innerArray){
       innerArray = innerArray.reduce(function(previousValue,currentValue){
           return currentValue > previousValue ? currentValue : previousValue;
       });
    });
    return arr;
}

console.log(largestOfFour([[4, 5, 1, 3],[1, 2, 3, 4]]));
Run Code Online (Sandbox Code Playgroud)

目前的输出是: [undefined, undefined]

我该如何修复我的代码?

javascript

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

在对象数组上使用 Array.map()

我正在尝试使用 Array.map 对description数组中每个对象的属性进行切片。

docs = docs.map(function(currentValue, index, array){
            currentValue['description'] = currentValue.description.slice(0,10);
            return array;
        });
Run Code Online (Sandbox Code Playgroud)

当我console.log(docs)看起来好像它已经起作用了。但是,由于某种原因,我无法再访问这些属性。

console.log(docs[0].description); //undefined
Run Code Online (Sandbox Code Playgroud)

看来我已经把我的对象数组变成了一个似乎是对象的字符串数组。有什么想法吗?

javascript arrays

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