我可以更改路由的工作方式以包括index.html吗?

时间:2019-03-29 15:10:16

标签: angular angular-router

通常,我会像往常一样路由Angular应用:

const panes = [
  { menuItem: "Tab 1", render: () => <Tab.Pane>Tab 1 Content</Tab.Pane> },
  { menuItem: "Tab 2", render: () => <Tab.Pane>Tab 2 Content</Tab.Pane> },
  { menuItem: "Tab 3", render: () => <Tab.Pane>Tab 3 Content</Tab.Pane> }
];

const MockAdapter = require("axios-mock-adapter");
const mock = new MockAdapter(axios);

mock.onGet("/dataschemas").reply(200, {
  data: [
    {
      id: "2",
      selfUri: "/dataschemas/2",
      type: "DataSchema",
      name: "Book Catalog"
    },
    {
      id: "3",
      selfUri: "/dataschemas/3",
      type: "DataSchema",
      name: "Business Articles"
    }
  ]
});

class App extends Component {
  constructor(props) {
    super(props);
    this.state = { activeIndex: 1, dataschemas: [], dataSchemaName: "" };
  }

  handleRangeChange = e => this.setState({ activeIndex: e.target.value });
  handleTabChange = (e, { activeIndex }) => this.setState({ activeIndex });

  async componentDidMount() {
    await this.getSchemas();
  }

  getSchemas = async () => {
    try {
      const { data } = await axios.get("/dataschemas");
      console.log(data);
      const dataschemas = data.data;

      this.setState({ dataschemas: dataschemas });

      console.log("This is the dataschema list:", dataschemas);
    } catch (error) {
      console.error(Error(`Error fetching results list: ${error.message}`));
    }
  };

  handleSchemaChange = e => {
    //handle data schema dropdown change
  };

  // Example of dropdown using dataschemas state

  render() {
    const { activeIndex, dataschemas, dataSchemaName } = this.state;

    return (
      <div>
        <div>activeIndex: {activeIndex}</div>
        <input
          type="range"
          max="2"
          value={activeIndex}
          onChange={this.handleRangeChange}
        />
        <Tab
          panes={panes}
          activeIndex={activeIndex}
          onTabChange={this.handleTabChange}
        />
        <Dropdown
          placeholder="Select data schema"
          scrolling
          clearable
          fluid
          selection
          search
          noResultsMessage="Try a different Search"
          multiple={false}
          options={dataschemas.map(schema => {
            return {
              key: schema.id,
              text: schema.name,
              value: schema.name
            };
          })}
          header="PLEASE SELECT A DATASCHEMA"
          value={dataSchemaName}
          onChange={this.handleSchemaChange}
          required
        />
      </div>
    );
  }
}

但是对于我当前的项目,我真的需要能够提供来自index.html的路由,包括以下内容:

{siteroot}/admin/users/1023929

这可能吗?我真的希望有人能提供帮助。我需要包括index.html并添加路由而不更改当前目录。

谢谢!

0 个答案:

没有答案