可以使用React或其他类似框架来创建这个事件处理程序。以下是一种如何处理这个切换按钮的示例代码：

首先，要创建一个切换按钮，可以使用React中的ToggleButton组件：

import React, { useState } from 'react';
import { ToggleButton } from 'react-bootstrap';

function PermissionToggle(props) {
  const [isChecked, setIsChecked] = useState(props.isChecked);

  function handleToggle() {
    setIsChecked(!isChecked);
    props.onToggle(!isChecked);
  }

  return (
    
  );
}

接下来，可以创建一个名为RoleForm的组件，其包含一个表单，其中包括一个名称字段和一个Permissions字段，以及一个由上面的ToggleButton组件组成的PermissionsToggle。

import React, { useState } from 'react';
import { Form, Button } from 'react-bootstrap';
import PermissionToggle from './PermissionToggle';

function RoleForm(props) {
  const { role, onSubmit } = props;
  const [name, setName] = useState(role.name);
  const [permissions, setPermissions] = useState(role.permissions);

  function handleNameChange(event) {
    setName(event.target.value);
  }

  function handlePermissionsToggle(isChecked) {
    setPermissions(isChecked ? 'full' : 'none');
  }

  function handleSubmit(event) {
    event.preventDefault();
    onSubmit({ name, permissions });
  }

  return (
    

      
        Name
        
      

      
        Permissions
        
      

      
        Submit
      
    
  );
}

这个RoleForm组件使用一个名为onSubmit的属性来指定当表单被提交时要调用的函数。在handleSubmit函数中，它将收集表单中的数据并将其传递给onSubmit函数。

当PermissionsToggle被切换时，它将调用handlePermissionsToggle函数，该函数将根据ToggleButton的isChecked值来设置permissions状态。

最后，在您的应用程序中使用RoleForm组件来创建或编辑角色，并将onSubmit函数指定为将角色数据提交给服务器的函数：

import React, { useState } from 'react';
import { Container, Row, Col } from 'react-bootstrap';
import RoleForm from './RoleForm';

function App() {
  const [roles, setRoles] = useState([
    { id: 1, name: 'Admin', permissions: 'full' },
    { id: 2, name: 'User', permissions: 'read-only' },
  ]);

  function handleRoleSubmit(role) {
    // This is where you would submit the role data to the server
    // and update the roles state accordingly.
    console.log('Submitting role:', role);
    setRoles([...roles, role]);
  }

  return (
    
      
        
          
Create a Role