Question

我有一个响应式响应Web应用程序，我需要一个特定的路由仅适用于移动设备，如果设备宽度小于例如'x'之类的东西，但所有路线都是在同一个文件中创建的，如：

<ExpandableListView
 android:id="@+id/list_single_choice_questions"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:dividerHeight="5dp"
 android:layout_marginLeft="8dp"
 android:layout_marginRight="8dp"
 android:divider="#ffffff"
 android:childDivider="#00000000"/>

所以现在可以从尺寸大于'x'宽度的设备访问路径，如何根据设备宽度使路线可用，或者如何根据设备尺寸阻止特定路线。

Answer 1

对于选择性路由，您可以检查路线渲染功能。这是一个例子：

class Example extends Component{
    constructor(props){
        super(props);

        this.check = this.check.bind(this);
    }

    check(){
        var w = window,
        d = document,
        e = d.documentElement,
        g = d.getElementsByTagName('body')[0],
        windowWidth = w.innerWidth || e.clientWidth || g.clientWidth; //window width

        return windowWidth > 568; //returns true for widths larger than 568 pixels
    }

    render(){
        return(
            <Router>
                <Route path='/example' render={() => {
                    if(this.check()) return <Child />; 
                    else return <OtherChild />;
                }}/>
            </Router>
        )
    }
}

如何根据设备尺寸阻止反应路线

1 个答案: