Maison >interface Web >js tutoriel >Cas pratique du système backend Vue.js 2.0

Cas pratique du système backend Vue.js 2.0

php中世界最好的语言
php中世界最好的语言original
2018-03-07 17:37:311808parcourir

Cette fois, je vais vous présenter un cas pratique du système backend Vue.js 2.0. Quelles sont les précautions pour l'utilisation réelle du système backend Vue.js 2.0. , jetons un coup d'oeil.

Mon ami a récemment voulu faire un OA pour son propre usage afin de mettre en pratique ses compétences (PS, il a toujours voulu créer une entreprise), alors il m'a demandé de le faire avec lui depuis le temps. est limité récemment, je l'ai aidé à écrire un framework pour lui-même.

J'utilise fil pour gérer le projet (je ne suis vraiment pas la tendance), bien sûr vous pouvez aussi utiliser la gestion Npm

Utilisez d'abord vue-clipour initialiser le projet , puis installez l'élément Vue-router Vuex, comme mon ami n'a jamais fait de travail front-end, j'ai choisi l'élément pour développer rapidement la page. Après avoir installé toutes les dépendances, la structure de répertoires ressemble à ceci

structure de répertoires

Ce qu'il faut noter ici, c'est que chacun de mes composants est un dossier composé d'index. vue script.js style.sass template.jade, qui peut être facilement formaté dans l'éditeur Lorsque fait référence à , il vous suffit de citer le dossier

e.g.
import NotFound from './views/404';
index.vue
<style lang="sass" scoped src="./style.sass"></style><template lang="jade" src="./template.pug"></template><script src="./script.js"></script>
script.js
export default {  data() {    return {    }  },  components: {  }}
sass
.red  color: red
.

Étant donné que le projet généré par vue-cli webpack n'utilise pas jade, vous devez ajouter vous-même le chargeur de jade de webpack

Notez que vous devez installer pug-html-loader jade

...
     {        test: /\.pug$/,
        loader: &#39;vue-html!pug-html&#39;
      },
...

Support Sass en ce moment

Afin de prendre en charge Sass, vous devez installer sass-loader node-sass

Vue-resourceJe l'ai installé et je l'ai installé Je n'ai pas encore décidé de l'utiliser. Je peux utiliser Ajax, j'utiliserai reqwest

Le projet ici fait référence au meilleur processus pratique de création d'une application d'une seule page avec vue2.0. , donc les fonctions des exemples sont les mêmes ~

S'il vous plaît Star github

Je le crois Vous maîtrisez la méthode dans le cas de cet article. Pour des informations plus intéressantes, veuillez faire attention. vers d'autres articles connexes sur le site Web php chinois !

Lecture connexe :

Connaissance JS sur les opérations de nomenclature organisées

10 expressions régulières js Exemples d'application

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn