小编joh*_*doe的帖子

如何使用webpack在CakePHP webroot中设置React？

我有一个现有的CakePHP项目(使用Model,View,Controller).我想在其webroot()中设置迷你React项目.将对控制器中定义的api进行ajax调用.Project/Miniproject/index.htmlindex.html

- Project
| - app
| | - Controller
| | - View
| | - Model
| | - webroot
| | | - Miniproject
| | | | - index.html [Mini react project]

我已经尝试安装React Transform Boilerplate.但它使用web dev服务器(并在localhost:3000上呈现文件).但我想要从运行CakePHP项目的nginx服务器渲染的文件.

当我访问url(Project/Miniproject/index.html)时,它找不到,dist/bundle.js因为它在内存中.那么如何使用webpack在CakePHP webroot中设置React？

我想创建一个垂直时间轴(如下所示)in react native但是我找不到一个像样的库.可以有人建议一个库,或者如果它不太棘手可以指导如何在没有库的情况下完成.

我需要通过google驱动器在cakephp上传电子表格.我使用google-api-php-client生成访问令牌和php-google-spreadsheet-client来访问sheet.Code如下:

function test() {
    require_once '../vendors/google-api-php-client-2.1.1/vendor/autoload.php';
    $client = new \Google_Client();
    $client->setApplicationName("spreadsheet");
    $client->setDeveloperKey("//My developerkey");
    $client = new Google_Client();
    $client->setAuthConfig('client_id.json');
    if( !isset($_GET['code']) ) {

        $client->addScope(Google_Service_Drive::DRIVE);
        $client->setRedirectUri('http://' . $_SERVER['HTTP_HOST'] . '/test' );
        $auth_url = $client->createAuthUrl();
        header('Location: ' . filter_var($auth_url, FILTER_SANITIZE_URL));
    } else {

        $client->setRedirectUri('http://' . $_SERVER['HTTP_HOST'] . '/test' );
        $auth_url = $client->createAuthUrl();
        $token = $client->fetchAccessTokenWithAuthCode($_GET['code']);
        $client->setAccessToken($token);

        $serviceRequest = new Google\Spreadsheet\DefaultServiceRequest($token['access_token']);
        Google\Spreadsheet\ServiceRequestFactory::setInstance($serviceRequest);
        $spreadsheetService = new Google\Spreadsheet\SpreadsheetService();
        $spreadsheetFeed = $spreadsheetService->getSpreadsheetFeed();
        $spreadsheet = $spreadsheetFeed->getByTitle('Test');
    }

但是我得到访问令牌无效的错误,如下图所示:

我做错了什么？

我正在阅读react-jsonschema-form的代码.我遇到了以下几行,我无法理解.

var formData = (0, _utils.getDefaultFormState)(schema, props.formData, definitions);

第一个括号内的内容如何传递参数(schema,props.formData等)的函数？

当我尝试连接到调试器时,它会抛出以下错误.

内部带有图像的多个View元素需要以两列布局显示。

我正在使用以下代码（基本上，获取窗口的Dimension（x）并设置View width = x / 2）。

父容器为flex: row。

但这似乎不起作用。我连续只得到一个图像，而不是图像中显示的两个图像。我做错了什么？

const window = Dimensions.get('window');
const imageWidth = (window.width/3)+30;
const imageHeight = window.width/3;
export default class Brochures extends Component {
  render() {
    const brochuresView = brochuresData.map( Brochure );
    return (
      <ScrollView style={styles.container}>
        {brochuresView}
      </ScrollView>
    );
  }
}

const Brochure = ( data ) => {
  const {child, image} = styles;
  return (
    <View key={data.id} style={child}>
      <Image
        style={image}
        source={{uri: data.url}}
      />
    </View>
  )
}

const styles = StyleSheet.create({
  container: { …

我正在尝试在 react-native 中创建循环进度组件（如图所示）。

我试过浏览 react-native 的艺术库。但对我来说似乎有点复杂。只是如何做到这一点的大纲会对我有很大帮助。

PS：像这样的库没有帮助，因为它不够灵活，无法在中心显示数字。

每次单击按钮时，我需要添加一个输入框（input-0，input-1 ...）。以下是相关代码。

//状态

      this.state = {
        newText: {}
      };

//添加动态输入文本的代码

      addInputText = () => {
        let dynamicTextsNo = Object.keys(this.state.newText).length;
        let newInputId = dynamicTextsNo+1;
        let dynamicTextArr = this.state.newText;
        let newTextId = 'input-'+dynamicTextsNo;
        dynamicTextArr[newTextId] = '';
        let newState = { ...this.state, newText: dynamicTextArr }
        this.setState( newState );
      }

//呈现动态输入文本的代码。

      dynamicTextArea = () => {
        return Object.keys(this.state.newText).map( ( key ) => {
          return  ( <InputGroup key={key} borderType='underline'>
                      <Input placeholder='Type your text here' value={this.state.newText[key]} onChange={this.changeInput}/>
                    </InputGroup>
                  );
        });
      }

//渲染功能

      render() {
        return <View>{this.dynamicTextArea()}</View> …