Question

我希望能够单击“新建”按钮，然后在db.js文件中调用一个函数（类似于我创建新用户的方法）来创建新的EventPage。

每个用户都有自己创建的EventPages列表，并且在该EventPage中应该有诸如Name，EventCode等之类的属性。

然后，我想以某种方式让任何人进入URL.com/Events/EventCode19xiu，它打开由某个用户生成的EventCode19xiu页面。

因此1. 如何在用户下的数据库中创建事件列表。

和2. 如何创建一个可以通过其唯一的URL访问的页面的事件？

我真的是Firebase的新手，会做出反应，如果您能向我指出正确的方向，那就太好了（尤其是做类似事情的教程）！

这是我的db.js文件（我已经使用Firebase身份验证/用户安装了所有文件）：

import { db } from './firebase';

// User API

export const doCreateUser = (id, username, email) =>
  db.ref(`users/${id}`).set({
    username,
    email,
  });

export const onceGetUsers = () =>
  db.ref('users').once('value');

Answer 1

您试图保存到数据库的状态是这样的州。

User 1: {
    username: 'User1',
    email: 'testuser1@testsmtp.com',
    events:[
            eventPage1: {
            Name: 'Event1',
            EventCode: '001'
            },
            eventPage2: {
            Name: 'Event2',
            EventCode: '002'
            }
    ]
}
User 2: {
    username:'User2',
    email:'testuser2@testsmtp.com',
    events:[
            eventPage1: {
            Name: 'Event1',
            EventCode: '003'
            }
    ]
}

在这种情况下，您应该像这样构造用户对象并将其保存到firebase中，以后再可以获取该对象。

谈到唯一URL部分，我从唯一URL 可以理解，您正在尝试执行 URL.com/Events/EventCode19xiu 之类的操作，您可以使用 React-Router

在React-Router中，您可以使用 LINK 来实现。

<Link 
  key={id} 
  to={{
    pathname: this.props.match.url + '/' + foo,
    search: '?EventCode=' + eventCode
  }} />

以后可以像这样通过新的 URLSearchParams（）访问搜索参数

componentDidMount() {
    const query = new URLSearchParams(this.props.location.search);
    for (let param of query.entries()) {
        console.log(param);
    }
}

当然，React-Router中肯定还有其他方法，请检查React-Router

希望这会有所帮助！

React.js和Firebase-在db中向用户添加对象并为该对象生成唯一的URL

1 个答案: