javascript - CollapseExpand Swagger Response Model Class - Stack Overflow

admin管理员组

文章数量:1277512

I'm using Swagger API documentation for my rest services. I have successfully integrated Swagger with my code and it works.

But I have a requirement to format the Swagger UI. Since the number of response classes are many in my project, the Swagger page looks very lengthy and the user has to scroll down a lot to view information.

So I want to collapse my response model classes and expand it when the user clicks the class. Is there a way to do it and if so where and what changes have to be made. I tried editing the Swagger-UI.js file but I could not achieve the needed output.

Please let me know and thanks in advance.

I'm using Swagger API documentation for my rest services. I have successfully integrated Swagger with my code and it works.

But I have a requirement to format the Swagger UI. Since the number of response classes are many in my project, the Swagger page looks very lengthy and the user has to scroll down a lot to view information.

So I want to collapse my response model classes and expand it when the user clicks the class. Is there a way to do it and if so where and what changes have to be made. I tried editing the Swagger-UI.js file but I could not achieve the needed output.

Please let me know and thanks in advance.

• javascript
• jquery
• swagger
• swagger-ui

Share Improve this question Follow asked Feb 25, 2014 at 8:27 user3350118user3350118 7111 silver badge22 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 4

swagger-ui has the parameter docExpansion. Default is list, but if set it to none in the defaults section in src/core/index.js :

docExpansion: "none"

it will work and collapse everything when loading the site.

To collapse swagger ui by default, you can use :

app = FastAPI(
swagger_ui_parameters = {"docExpansion":"none"},
...
)

for collapse all endpoints by default:

const express = require("express");
const app = express();
const swaggerUi = require('swagger-ui-express');
const swaggerDoc = require('./swagger-output.json');

app.use('/doc', swaggerUi.serve, swaggerUi.setup(swaggerDoc, false, { docExpansion: 'none' }));

Swagger-UI.js is generated it would be very hard to modify Swagger UI by modifying this file.

If you want to customize SwaggerUI you should clone the github repository https://github./swagger-api/swagger-ui/ then modify files and rebuild it (you will then get a modified Swagger-UI.js and all other files).

Swagger-UI is posed of different views, each view having a js file and a handlebars template. In your use case I'll try to modify these files:

• src/main/template/signature.handlebars
• src/main/javascript/view/SignatureView.js

本文标签： javascriptCollapseExpand Swagger Response Model ClassStack Overflow