Componentização
Olá a todos, sou um código husky, estudante de engenharia de redes na Software College, porque sou um "cachorro" e posso comer carne por milhares de quilômetros. Quero compartilhar o que aprendi na faculdade e progredir com todos. Porém, devido ao nível limitado, inevitavelmente haverá alguns erros no blog. Se houver alguma omissão, por favor me avise! Por enquanto, atualize apenas na plataforma csdn, a homepage do blog: https://blog.csdn.net/qq_42027681 .
未经本人允许,禁止转载
Neste artigo, vamos falar sobre a ideia de componentização. É
como nossas roupas. Não podemos usar um conjunto de uma vez (cuecas, calcinhas, meias, calças de algodão, jaquetas, etc.). Não podemos costurá-los e usá-los juntos. Agora
que você fez roupas bonitas, pode mostrá-las a outras pessoas para fazer roupas para referência. As roupas também podem ser tingidas e mudadas de tamanho.
A página da web que costumávamos praticar antes é para fazer várias roupas e costurá-las. Agora vamos desmontá-las. Faça separadamente, vista o que você quiser vestir, como você gosta de combinar e como combinar
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<object data="./my-menu/index.html" width="500px" height="50px"></object>
<object data="./my-button/index.html"></object>
</body>
</html>
Todo mundo vai ficar muito confuso, porque essa coisa é assim
(foto da Internet)
Não se preocupe em fazer roupas
由于还没有将js本文主讲思想所以没有写js文件且css样式写在元素内 后面讲js会再提 (大佬勿喷)
Este é
o arquivo index.html em minha estrutura de diretório my-button
<div style="width: 150px;height: 50px;line-height: 50px;background-color: teal;color: white;text-align: center;position: absolute;left: 0;top: 0;">点击</div>
arquivo index.html em meu menu
<div style="width: 500px;height: 50px;line-height: 50px;background-color: black;color: white;position: absolute;left: 0;top: 0;">
<li style="list-style: none;float: left;position: relative;left: 50px;">首页</li>
<li style="list-style: none;float: left;position: relative;left: 150px;">介绍</li>
<li style="list-style: none;float: left;position: relative;left: 250px;">联系</li>
</div>
Através da página de entrada
<object data="文件所在路径" width="宽" height="高"></object>
O controle de largura e altura introduzido aqui é a largura e altura do objeto
Foco
A ideia de componentização pode desenvolver nossa própria biblioteca de componentes para facilitar nosso desenvolvimento ou usar a biblioteca de componentes de outra pessoa para o desenvolvimento. Quando um elemento da mesma configuração é usado várias vezes, ele deve ser componentizado, reduzindo a confusão de código e parecendo simples
Você pode dar uma olhada em vant (terminal móvel e pequeno programa) elementui e outras bibliotecas de componentes de boa aparência
entrada Vant: manual
Vant elementui entrada: manual Elementui
Será lançado mais tarde
Front end: entrada js entrada vue miniaplicativo de desenvolvimento vue, etc.
Back end: entrada java entrada springboot, etc.
Servidor: servidor de entrada mysql instruções simples servidor nuvem para executar o projeto
python: recomendado não aquecer o fogo, certifique-se de ver
o uso de alguns plug-ins, etc.
O caminho da universidade também é em si mesmo, estudar muito, jovens
com paixão. Se você está interessado em programação, você pode se juntar ao nosso grupo qq para se comunicar: 974178910
Se você tiver alguma dúvida, pode deixar uma mensagem abaixo, e eu responderei se você a vir