Question

要声明一个常量文件，我首先在与使用该常量的组件import { Component } from 'react'; import InfoItem from '../ui/InfoItem; const deleteContact = async contactID => { }; export default class SearchResultPanel extends Component { state = { contactInfo: {}, }; componentDidMount() { const { info, handleChange } = this.props; this.setState({contactInfo: info }); handleChange(this.state); } componentDidUpdate(_, prevState) { const { handleChange } = this.props; if (this.state !== prevState) { handleChange(prevState.contactInfo.id); } } handleDelete = async contactID => { await deleteContact(contactID); this.setState(prevState => ({ contactInfo: prevState.contactInfo.id === contactID? {} : prevState.contactInfo, })); }; render() { const { info, isAdmin } = this.props; const { routingNumber, name, date, } = info; return ( <div> <div> <div> <div> <InfoItem header="ROUTING NUMBER" detail={routingNumber} /> <InfoItem header="NAME" detail={name} /> <InfoItem header="DATE" detail={date} /> </div> </div> <button onClick={() => this.handleDelete(info.id)} > <DeleteIcon /> </button> )} </div> </div> </div> </div> ); } }相同的树级别上创建它，如下所示：

@Component
@Order(Ordered.HIGHEST_PRECEDENCE)
public class CorsFilter implements Filter {

@Override
public void init(FilterConfig filterConfig) throws ServletException {

}

@Override
public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain)
        throws IOException, ServletException {
    HttpServletResponse response = (HttpServletResponse) servletResponse;
    HttpServletRequest request = (HttpServletRequest) servletRequest;
    response.setHeader("Access-Control-Allow-Origin", "http://localhost:4200");
    response.setHeader("Access-Control-Allow-Methods", "GET,POST,DELETE,PUT,OPTIONS");
    response.setHeader("Access-Control-Allow-Headers",
            "Content-Type, Access-Control-Allow-Origin, Access-Control-Allow-Headers, Authorization, X-Requested-With, Cache-Control");
    response.setHeader("Access-Control-Allow-Credentials", "true");
    response.setHeader("Access-Control-Max-Age", "180");
    if(!request.getMethod().equals("OPTIONS")) {
        filterChain.doFilter(servletRequest, servletResponse);
        return;
    }
    response.setStatus(HttpStatus.OK.value());

}

@Override
public void destroy() {

}

然后从控制器以这种方式导入它：

email.constants.ts

这种做法好吗？我在这里问这个问题，因为我找不到官方指导风格的答案

Answer 1

我会这样做：

export const MAXIMUM_NUMBER = 10;

和

import { MAXIMUM_NUMBER } from './emails.constants';

因此，仅导入您使用的内容，而不是所有内容。

但是如果您仍然想使用所有内容，则可以像完成操作一样进行操作，只需稍作更改即可：

import * as EmailConstants from './emails.constants';

那您仍然可以使用

EmailConstants.MAXIMUM_NUMBER

Answer 2

您是否要通过“将文件放在同一树级别上”来避免名称冲突？如果是这样，请考虑Dependency Injection and Injection Tokens。

没有行为的班级对我来说也是一种错误。

Answer 3

优良作法是为常量创建一个单独的文件。在可能存在多种情况的情况下， 我更喜欢/推荐第二种情况 -

1）导出每个常量并根据需要导入；如果您没有太多的常量。

export const TEST = "testval";
export const TEST2 = "testval2";

导入为-

import { TEST, TEST2 } from './app.constants';

2）如果常量太多并且想要导入无忧，则创建并导出一个 Injectable 类

因此，您的 app.constants.ts 为-

import { Injectable } from '@angular/core';

@Injectable({
    providedIn: 'root'
})
export class AppConstants {
    public TEST = "testval";
    public TEST2 = "testval2";
}

然后，您可以将其简单地注入到所需的类中，例如-

constructor(private constants: AppConstants)并用作-constants.TEST

3）您也可以将对象导出为-

export const constObj = {
    TEST: "testval",
    TEST2: "testval2"
};

并将其导入为-

import { constObj } from './app.constants';并用作-constObj.TEST

Angular N-声明常量文件的最佳实践是什么？

3 个答案: