topology vue demo

demonstração de topologia

Editor de topologia baseado em topologia + elemenu-ui + vue-cli (apenas para referência de aprendizagem)

No momento, a função é muito simples. Referenciei várias demonstrações sobre topologia escritas por Vue e integrei-as para alterá-las para algo com o qual estou familiarizado. Continuaremos a manter e adicionar implementação de API na topologia

Seleção de tecnologia

• Vue-Cli
• Topologia
• Elemento-ui

Ideias

O quadro geral é baseado em outras demonstrações relativamente bem feitas, e então os componentes são divididos de acordo com o layout para facilitar o desenvolvimento por componentes. Principalmente para operar o objeto canvas, passe o canvas para cada componente, e o componente opera sozinho (o princípio é operar objetos com o mesmo endereço de aplicação), ou emite para chamar de volta o método do componente pai. O exemplo oficial do Le5le é escrito em Nuxt e usa Vuex para notificar o componente pai quais métodos chamar. Como não quero apresentar o vuex aqui, removi-o e substituí-o pelo atual. Não encontrei nenhum problema até agora. Se você tiver métodos melhores, por favor, me dê alguma orientação.

Uso

Operação do projeto

 npm i
npm run serve

Construção do projeto

 npm run build

Lints e corrige arquivos

 npm run lint

Perguntas frequentes

Por que o preenchimento é: 50px em App.vue

Isto é para testar um bug de topologia. Ao arrastar o componente esquerdo para a tela, a página retornará para uma determinada posição. Porque quando o colocamos no projeto como um componente, não é necessariamente uma interface separada, mas pode ser usado como um componente envolvido por uma caixa de diálogo ou contêiner, então esse bug ainda terá algum impacto. Pode ser removido em circunstâncias normais

Execute a captura de tela