小编Lyu*_*mir的帖子

我正在发现ReactJS和material-ui(http://material-ui.com/).

我尝试为我的应用程序创建一个默认模板.我想在分离的组件中使用AppBar和LeftNav(在新版本的Drawer中重命名).

默认情况下,AppBar上有一个菜单按钮.我想用它来打开LeftNav,但我不知道如何调用我的LeftBarComponent组件函数来打开它.

我几乎了解如何在组件之间进行通信,但在我的情况下,我不知道如何做,因为没有关于它的文档.我知道打开LeftNav元素的唯一方法是使用LeftNav.toggle()

http://material-ui.com/#/components/left-nav

谢谢你的帮助.

Default.jsx

use strict';

var React = require('react');
var pageStore = require('../../stores/page');

var MainNavbar = require('../modules/navbar.jsx');
var LeftNavbar = require('../modules/leftbar.jsx');

var getState = function() {
  return {
    title: pageStore.get().title
  };
};

var DefaultComponent = React.createClass({
  mixins: [pageStore.mixin],
  componentDidMount: function() {
    pageStore.emitChange();
  },
  getInitialState: function() {
    return getState();
  },
  render: function() {
    return (
      /* jshint ignore:start */
      <div className="main-container">
        <MainNavbar />
        <LeftNavbar />
        <div className="content">
          {this.props.children}
        </div>
      </div>
      /* jshint ignore:end …

假设我有以下组件

class MyComponent extends 
React.Component<IProps, IState> implements MyInterface {...}

现在我想说的是,有些变量是一个instance的React.Component有IProps, IState和implements MyInterface,像

myComponent: Component<IProps, IState> implements MyInterface,但这不起作用,我不知道为什么.

有人可以澄清一下吗？我刚开始使用TypeScript而无法解决这个问题.有什么可以替代呢？

请注意: myComponent: MyComponent不是我要找的答案.我想纠正我对TypeScript的误解.

我是一个项目的所有者，想授予其他用户查看Google Cloud Build日志的权限，但是我无法弄清楚该用户需要哪个角色/权限。

我未成功尝试的角色是：Cloud Build编辑器，Cloud Build查看器，Stackdriver Debugger代理，Stackdriver Debugger用户，Cloud Trace Admin，Logging Admin，Private Logs Viewer，Logs Viewer，Monitoring Admin

以下React.js代码使用两个名为“ about”和“ project”的链接来渲染导航栏。在页面加载时，“关于”链接处于活动状态，并显示为红色。单击另一个链接后，导航栏的状态将设置为“项目”，“链接”样式将重新设置，并且“项目”将显示为红色。

我通过在两个链接标记上附加一个单击处理程序，并将active状态设置为event.target.innerHTML的名称来实现。

我是新来的反应者，我认为这是解决该问题的非常冗长的方法。我知道有一个activeClassName属性可以传递给react-router链接，但是我想要一种不使用它的方法。

import React, { Component } from 'react'
import { Link, Route } from 'react-router'

export default class Navbar extends Component {
    constructor() {
        super();
        this.state = {
            active: 'about'
        }
        this._handleClick = this._handleClick.bind(this);
    }

    _handleClick(e) {
         this.setState({
            active: e.target.innerHTML
         });
    }

    render() {
        let aboutStyle;
        let projectStyle;

        if (this.state.active === 'about') {
            aboutStyle = { color: '#ff3333' };
            projectStyle = {};
        } else {
            aboutStyle = {};
            projectStyle = { color: '#ff3333' };
        }

        return …