Question

（使用React / LoopBack / MongoDB）我想将电子邮件发送到已保存在用户帐户集中的电子邮件中，有一个我可以通过this.props.account.email访问的电子邮件属性，I在网上搜索，但我不知道如何正确实施，是否有任何进口？如何通过单击按钮发送电子邮件。这是我的前端代码，用于找到按钮的页面（按钮位于返回下方）：

--------- Code --------

/* eslint linebreak-style: ["error", "windows"] */
import React, { Component } from 'react';
import axios from 'axios';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { Helmet } from 'react-helmet';

// Grommet
import Box from 'grommet/components/Box';
import Heading from 'grommet/components/Heading';
import Accordion from 'grommet/components/Accordion';
import AccordionItem from '../../Components/Accordion';

import AccountDescrSection from './Sections/AccountDescription';

import AccountActions from '../../../../Redux/AccountRedux';

import ActivityIndicator from '../../../../Components/ActivityIndicator';


import './Styles.scss';

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

    this.state = {
      activeSection: []
    };
  }

  componentDidMount() {
    this.props.get();
  }

  componentWillMount() {
    this.getComments();
  }
  getComments() {
    axios.get('http://localhost:3001/api/Comments')
      .then(response => {
        console.log(response.data);
      });
  }


  render() {
    return (

      <Box pad='medium' className='dashboard-settings'>
        <p>
          { (
            <button
              style={{ background: 'yellow', color: 'black', style: 'text-align:center;' }}
            >
            Send email
            </button>
          )}
        </p>
        <Helmet>
          <title>Office Hours | Account Settings</title>
        </Helmet>
        <Box>
          <Heading tag='h3' className='screen-title'>
            Profile
          </Heading>
        </Box>
        <Choose>
          <When condition={ this.props.fetching || !this.props.account.id }>
            <Box align='center' pad='xlarge' margin='large'>
              <ActivityIndicator />
            </Box>
          </When>
          <Otherwise>
            <Accordion active={this.state.activeSection} animate={false} openMulti={false}>

              {AccordionItem({
                title: 'Name',
                description: <div><b>{this.props.account.name}</b></div>
              })}

              {AccordionItem({
                title: 'Description',
                description: <div><b>{this.props.account.description}</b></div>,
                content: <AccountDescrSection close={() => this.setState({ activeSection: [] })} />
              })}


              {AccordionItem({
                title: 'Email address',
                description: <div>{this.props.account.email}</div>
              })}

              {AccordionItem({
                title: 'Description',
                description: <div><b>{this.props.account.description}</b></div>
              })}

              {AccordionItem({
                title: 'Password',
                description: <div>Click on edit profile to change or edit password </div>

              })}
            </Accordion>
          </Otherwise>
        </Choose>
      </Box>
    );
  }
}

const mapStateToProps = store => {
  return {
    account: store.account.data,
    fetching: store.account.fetching
  };
};

const mapDispatchToProps = dispatch => {
  return {
    get: () => dispatch(AccountActions.accountGet())
  };
};

AccountScreen.propTypes = {
  get: PropTypes.func,
  fetching: PropTypes.bool,
  account: PropTypes.object,
  comment: PropTypes.object
};

export default connect(mapStateToProps, mapDispatchToProps)(AccountScreen);
enter code here

提前致谢。

Answer 1

您可以在环回中创建和调用自定义方法，并使用nodemailer发送电子邮件

<script> var chart = AmCharts.makeChart( "chartdiv",{ "type": "pie", "theme": "light", "dataProvider": [ { "country": "totalstaff", "litres": $val->totalstaff; }, { "country": "totaltasks", "litres": $val->totaltasks; }, { "country": "completed tasks", "litres": $val->is_completed; }, { "country": "pendingtasks", "litres": $pending; } ], "valueField": "litres", "titleField": "country", "balloon":{ "fixedPosition":true }, "export": { "enabled": true } } ); </script>

我希望能够通过点击发送电子邮件按钮（使用React，LoopBack，MongoDB）向gmail / yahoo帐户发送真实的电子邮件

1 个答案: