码迷,mamicode.com
首页 > 其他好文 > 详细

vue中获取本地ip

时间:2019-08-05 14:03:36      阅读:306      评论:0      收藏:0      [点我收藏+]

标签:http   func   fun   user   ip地址   rip   src   pre   turn   

一、目的

获取当前访问的ip地址

二、思路

通过使用搜狐的api获取访问ip

三、操作步骤

1、在index.html中添加

<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>

2、新建一个组件Admin.vue,调用方法

 <template>
     <div>
         <h1>username:{{user.username}}</h1>
         <h1>age:{{user.age}}</h1>
         <h1>ip:{{user.ip}}</h1>
     </div>
 </template>
 
 <script>
 export default {
    data(){
        return{
            user:{
                ‘username‘:‘sj‘,
                ‘age‘:18,
                ‘ip‘:‘‘
            }
        }
    },
    mounted(){
        this.ready()
    },
    methods:{
        ready:function(){
                //获取本地IP地址
                //js 引入 <!-- 获取本机ip  -->
                //<script src="http://pv.sohu.com/cityjson?ie=utf-8">
            var cip = returnCitySN["cip"];
                //给vuedata对象里的字段赋值
            this.user.ip = cip
        }
    }
    
 }
 </script> 

三、结果展示

1、搜狐网站访问结果

技术图片

 

2、运行结果

技术图片

vue中获取本地ip

标签:http   func   fun   user   ip地址   rip   src   pre   turn   

原文地址:https://www.cnblogs.com/JimShi/p/11302384.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!