找到当前路由的索引，然后使用React JS和React Router将索引传递给组件属性

的步骤如下：

1. 首先，确保你已经安装了React JS和React Router，并且已经在你的项目中引入它们。
2. 在你的组件中，使用React Router的useLocation钩子来获取当前的路由信息。useLocation钩子返回一个包含当前路由信息的对象。
3. 从useLocation返回的对象中，你可以获取到当前路由的路径。例如，你可以使用pathname属性来获取当前路由的路径。
4. 接下来，你需要找到当前路由在路由配置中的索引。你可以根据你的项目需求来决定如何实现这一步骤。一种常见的做法是，在路由配置中为每个路由对象添加一个key属性，然后根据当前路由的路径来查找对应的索引。
5. 一旦你找到了当前路由在路由配置中的索引，你可以将它传递给你的组件属性。你可以使用React的属性传递机制来实现这一步骤。

下面是一个示例代码，演示了如何找到当前路由的索引并将其传递给组件属性：

import React from 'react';
import { useLocation } from 'react-router-dom';

const MyComponent = () => {
  const location = useLocation();
  const currentPath = location.pathname;

  // 假设你的路由配置如下
  const routes = [
    { path: '/', component: Home, key: 'home' },
    { path: '/about', component: About, key: 'about' },
    { path: '/contact', component: Contact, key: 'contact' },
  ];

  // 找到当前路由在路由配置中的索引
  const currentIndex = routes.findIndex(route => route.path === currentPath);

  // 将索引传递给组件属性
  return <YourComponent currentIndex={currentIndex} />;
};

在上面的示例中，currentIndex变量将包含当前路由在路由配置中的索引。你可以将它传递给你的组件属性，例如YourComponent组件。

请注意，上述示例中的路由配置和组件名称仅作为示例，你需要根据你的项目实际情况进行相应的修改。

希望以上内容能够帮助到你！如果你需要了解更多关于React JS和React Router的信息，可以参考腾讯云的相关产品和文档：

• React JS
• React Router