Question

我是reactjs的新手 - 想要添加一些在循环中的第3和第4项上生效的条件类

<div className={'medium-20 large-12 columns' + (index === 3 ? 'medium-push-10' : null)}>

if index 3 -- medium-push-10
if index 4 -- medium-pull-10

Answer 1

对于快速解决方案，您可以在第一个条件运算符的第二个结果中添加另一个条件运算符。

public class MyMarkupExtension : MarkupExtension
{
    public string Color { get; set; }

    public override object ProvideValue(IServiceProvider serviceProvider)
    {
        IProvideValueTarget provideValueTarget = (IProvideValueTarget)serviceProvider.GetService(typeof(IProvideValueTarget));

        // The following target is a Setter instance, 
        // which doesn't have ListBoxItem.DataContext property.
        var target = provideValueTarget.TargetObject;

        // I put break point here.
        // **How can I get ListBoxItem.DataContext instance here?**
    }
}

不要对此深入了解，否则您的代码很快就会无法读取。

Answer 2

您可以使用this npm包。它自动处理所有内容（字符串，数组，对象，函数，null，未定义），并具有基于具有简单语法的变量的静态和条件类选项。全部在1kb。

// Support for string arguments
getClassNames('class1', 'class2');

// support for Object
getClassNames({class1: true, class2 : false});

// support for all type of data
getClassNames('class1', 'class2', ['class3', 'class4'], { 
    class5 : function() { return false; },
    class6 : function() { return true; }
});
// "class1 class2 class3 class4 class6"

<div className={getClassNames('show',{class1: true, class2 : false})} />
// "show class1"

Reactjs多个条件类

2 个答案: