wiki/index.js

console.log("hello world");
/**
console.log(process.argv);
process.argv.forEach(item => {
  console.log(item);
});
console.log("dirname : "+__dirname);
console.log("filename : "+__filename);
**/
console.log("----------------------------");
const comm=require("./commonjs.js");
comm.info();
console.log("----------------------------");
//import {esname,esfunc} from "./es.mjs"
//es.func();

console.log("----------------------------");
console.log("<h3>this is node test string!!!</h3>");

//const {createApp}=Vue;
import {createApp } from 'vue';
//import { createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js';
//import { createApp } from './js/vue.esm-browser.js';
//import { createApp } from './js/vue.global.js';
//import { Home } from "./vue/Home.vue";
import Home from "./vue/Home.vue";
import test from "./vue/test.vue";
import About from "./vue/About.vue";
import i18n from "./i18n.js";
import { useI18n } from 'vue-i18n';

/**
const { locale,t } = useI18n();
console.log("----------------------------");
const changelang = type => {
  console.log(locale);
  console.log("----------------------------");
  locale.value=type;
}
**/
//import router from "./router.vue";
import router from "./router.js";
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
//console.log(createApp);
//console.log(i18n);
console.log(router);
const app=createApp({
  template:'#my-app',
//  template:`<div v-html='info'>template</div>`,
  components:{
    Home,
    test,
    About
  },
  data(){
    return{
      info:`<span style='color:red; font-size:30px'>hello vue template</span>`,
      number:0,
      locale:null,
      options:[
        {value: 'zh', label: '中文',},
        {value: 'en', label: 'English',},
        {value: 'ja', label: 'にほんご',},
      ],
      tomcat_res:"",
      books:[{"title":"Linux从入门到精通","author":"night-cherry","publisher":"peking press","pages":123}],
    }
  },
  methods:{
    add(){
      this.number++;
    },

    changelang(type){
      console.log("-----------change lang-----------------");
      console.log("this.locale : "+this.locale);
      console.log("locale"+locale);
      locale.value=type;
    },
    interface_web(){
      console.log("---------tomcat server----------");
      console.log("this.tomcat_res : "+this.tomcat_res);
      const request = new XMLHttpRequest();
      request.onload=function(){
        console.log("--------parse tomcat server string--------");
        const res=JSON.parse(request.responseText);

        this.tomcat_res=res[0].title;
        console.log("res:"+res);
        console.log("res[0].title :"+res[0].title);
        console.log("res[0].author :"+res[0].author);
        console.log("res[0].publisher :"+res[0].publisher);
        console.log("res[0].pages :"+res[0].pages);
        console.log("res[1][\"title\"] :"+res[1]["title"]);
        console.log("res[1][\"author\"] :"+res[1]["author"]);
        console.log("this.tomcat_res : "+this.tomcat_res);
        alert("this.tomcat_res : "+this.tomcat_res);
        console.log("tomcat_res : "+tomcat_res);
      };
      request.open("POST","http://ancientapes.cc:8080/mineluxuries/book");
      request.send("test tomcat");
    }

  },
  setup(){
    const { locale,t } = useI18n();
    console.log("-------get locale--------");
      console.log(locale);
//    this.locale=locale;
//    在根文件直接使用locale需要绑定一个locale变量至浏览器对象Window
//    否则无法让methods中的方法调用其中的变量（全局变量）
//    如果封装在组件中，然后提供给父组件使用，则直接定义函数即可
    window.locale=locale;
    console.log("-------after get locale--------");
  }
}).use(i18n).use(router).use(ElementPlus).mount("#app");
//Vue.createApp(app).mount("#app");
                                                     
console.log("end the vue template render");