The existing mainstream report system in the market can meet the daily report generation. However, it is difficult to maintain the system later due to the poor satisfaction of its report personalization and the high front-end and backend dependencies. In order to solve the above problems, this paper studies the development idea of Vue components. The technical characteristics of Vue and the source code of the Axios framework are analyzed, and a visual component model is proposed in combination with the application scenarios and development process. The data transmission method of the components is clarified in the actual application layer, which enhances the control of the page in the front-end component development process. The ability to convert complex reports into the construction of visual components and the dynamic data components to obtain data effectively improves the reporting system's development speed and meets the needs of personalized reports.