1
Reactベースのユーザー登録UI（https://www.meteor.com/tutorials/react/adding-user-accounts）を構築する公式のMeteor/Reactチュートリアルに従っています。チュートリアルでは、私はブレイズラッパーを使用して反応させ、ベースのユーザー登録機能を構築することができることを示していますReactJSを使用してMeteorの新しいユーザー登録UIに役割情報を含める方法
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { Template } from 'meteor/templating';
import { Blaze } from 'meteor/blaze';
export default class AccountsUIWrapper extends Component {
componentDidMount() {
// Use Meteor Blaze to render login buttons
this.view = Blaze.render(Template.loginButtons,
ReactDOM.findDOMNode(this.refs.container));
}
componentWillUnmount() {
// Clean up Blaze view
Blaze.remove(this.view);
}
render() {
// Just render a placeholder container that will be filled in
return <span ref="container" />;
}
}
このラッパーは、新しいユーザーを作成するときに、誰かがユーザー名とパスワードを設定することができるようになります。私はロールを新しいユーザに指定できるように拡張したかったのです。
MeteorのAccounts.ui.configは、登録UIに役割フィールドを含む設定オプションをサポートしていないようです。 alanning:rolesパッケージを使用してユーザーに役割を割り当てることができます。しかし、alanning:rolesパッケージとBlazeラッパーを統合する方法を見つけるのには苦労しています。
以下のコードスニペットのようなものをBlazeラッパーに追加することはできますか？最初にonSubmit = { this.register }のいずれかを使用して登録フォームをレンダリングし、あなたの登録フォームで、その後
register(event) {
// Stop the default behavior when the button is clicked
event.preventDefault();
// Get the data from the DOM elements and clean it up
var username = React.findDOMNode(this.refs.username).value.trim();
var password = React.findDOMNode(this.refs.password).value.trim();
var role = React.findDOMNode(this.refs.role).value.trim();
// Set up the user object with the input data
var options = {
username: username,
password: password,
role: role,
};
// Create the new user with the data
Accounts.createUser(options);
return false;
}
：あなたは、次のようになりますあなたのコンポーネントにカスタムメソッドを作成することができるはず
var id = Accounts.createUser({
username: username,
password: password
});
Roles.addUsersToRoles(id, ['admin']);