{
   {message}}        
              
      
{
   {message}}
        
              
      
{
   {reversedMessage}}
        
      
        
      
{
   {yhtml}}
        
              
      
属性绑定
        
              
      
属性绑定
        
              
      
现在看到了
        
              
      
            
       
{
   {item}}
        
      
        
      
            
       
{
   {item.text}}
        
      
        
              
      逆转消息事件        
              
              
      
        
        
      
{
   {vuobj.a}}
        
      
            
               
      
    
     

 vue使用ajax时：

Get 请求：

this.$http.get('/try/ajax/ajax_info.txt').then(function(res){

document.write(res.body); },function(){

console.log('请求失败处理'); });

post 请求：

this.$http.post('/try/ajax/demo_test_post.php',{

name:"菜鸟教程",url:"http://www.runoob.com"},{

emulateJSON:true}).then(function(res){

document.write(res.body); },function(res){

console.log(res.status); });

 

VUE安装：使用vue脚手架

vue-cli3的安装：

npm install -g @vue/cli 安装之后，就可以在命令行中访问 vue 命令。

创建项目两种项目：

1、vue create 文件英文名

2、图像化界面创建：

vue ui会打开浏览器窗口

Vue-cli3 项目配置 Vue.config.js

视频学习：http://www.bjsxt.com/down/9193.html

只需要在项目的根目录下新建 vue.config.js 文件（是根目录，不是src目录）

module.exports = { // 基本路径 baseUrl: '/', // 输出文件目录 outputDir: 'dist', // eslint-loader 是否在保存的时候检查 lintOnSave: true, // use the full build with in-browser compiler? // https://vuejs.org/v2/guide/installation.html#Runtime-Compiler-vs-Runtime-only compiler: false, // webpack配置 // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md chainWebpack: () => {}, configureWebpack: () => {}, // vue-loader 配置项 // https://vue-loader.vuejs.org/en/options.html vueLoader: {}, // 生产环境是否生成 sourceMap 文件 productionSourceMap: true, // css相关配置 css: {  // 是否使用css分离插件 ExtractTextPlugin  extract: true,  // 开启 CSS source maps?  sourceMap: false,  // css预设器配置项  loaderOptions: {},  // 启用 CSS modules for all css / pre-processor files.  modules: false }, // use thread-loader for babel & TS in production build // enabled by default if the machine has more than 1 cores parallel: require('os').cpus().length > 1, // 是否启用dll // See https://github.com/vuejs/vue-cli/blob/dev/docs/cli-service.md#dll-mode dll: false, // PWA 插件相关配置 // see https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa pwa: {}, // webpack-dev-server 相关配置 devServer: {  open: process.platform === 'darwin',  host: '0.0.0.0',  port: 8080,  https: false,  hotOnly: false,  proxy: null, // 设置代理  before: app => {} }, // 第三方插件配置 pluginOptions: {  // ... }}

 

npm run build打包文件  

npm run serve运行项目